fix(ui): refreshing the page if pressing enter in the search, horizontal scrolling the monitor lit on mobile/tablets and aligning items in the monitor list (#6751)

This commit is contained in:
Maybe
2026-01-17 16:56:55 +09:00
committed by GitHub
parent f470b01168
commit 777c252915
2 changed files with 6 additions and 7 deletions

View File

@@ -1,5 +1,5 @@
<template>
<div class="shadow-box mb-3" :style="boxStyle">
<div class="shadow-box mb-3 p-0" :style="boxStyle">
<div class="list-header">
<div class="header-top">
<div class="select-checkbox-wrapper">
@@ -28,7 +28,7 @@
<a v-if="searchText != ''" class="search-icon" @click="clearSearchText">
<font-awesome-icon icon="times" />
</a>
<form>
<form @submit.prevent>
<input
v-model="searchText"
class="form-control search-input"
@@ -89,7 +89,7 @@
</div>
<div
ref="monitorList"
class="monitor-list"
class="monitor-list px-2"
:class="{ scrollbar: scrollbar }"
:style="monitorListStyle"
data-testid="monitor-list"
@@ -536,7 +536,6 @@ export default {
.list-header {
border-bottom: 1px solid #dee2e6;
border-radius: 10px 10px 0 0;
margin: -10px;
margin-bottom: 10px;
padding: 10px;
@@ -679,7 +678,6 @@ export default {
@media (max-width: 770px) {
.list-header {
margin: -20px;
margin-bottom: 10px;
padding: 5px;
}

View File

@@ -24,12 +24,12 @@
<router-link :to="monitorURL(monitor.id)" class="item" :class="{ disabled: !monitor.active }">
<div class="row">
<div
class="col-9 col-xl-6 small-padding"
class="col-9 col-xl-6 small-padding d-flex align-items-center"
:class="{
'monitor-item': $root.userHeartbeatBar == 'bottom' || $root.userHeartbeatBar == 'none',
}"
>
<div class="info">
<div class="info d-flex align-items-center gap-2">
<Uptime :monitor="monitor" type="24" :pill="true" />
<span v-if="hasChildren" class="collapse-padding" @click.prevent="changeCollapsed">
<font-awesome-icon
@@ -383,6 +383,7 @@ export default {
/* We don't want the padding change due to the border animated */
.item {
padding: 12px 15px;
transition: none !important;
}