self-hosted/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2024-12-24 22:14:47 +02:00
Code Issues Actions 1 Releases Activity

Fix: name column in the dashboad being squashed in some aspect ratios (#4193)

Browse Source
This commit is contained in:
Jay Bhanushali 2024-08-24 23:14:51 +05:30 committed by GitHub
parent 9486fa22ee
commit 3e88772e5d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 13 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/pages/DashboardHome.vue
View File

@ -57,7 +57,7 @@
</thead> </thead>
<tbody> <tbody>
<tr v-for="(beat, index) in displayedRecords" :key="index" :class="{ 'shadow-box': $root.windowWidth <= 550}"> <tr v-for="(beat, index) in displayedRecords" :key="index" :class="{ 'shadow-box': $root.windowWidth <= 550}">
<td><router-link :to="`/dashboard/${beat.monitorID}`">{{ $root.monitorList[beat.monitorID]?.name }}</router-link></td> <td class="name-column"><router-link :to="`/dashboard/${beat.monitorID}`">{{ $root.monitorList[beat.monitorID]?.name }}</router-link></td>
<td><Status :status="beat.status" /></td> <td><Status :status="beat.status" /></td>
<td :class="{ 'border-0':! beat.msg}"><Datetime :value="beat.time" /></td> <td :class="{ 'border-0':! beat.msg}"><Datetime :value="beat.time" /></td>
<td class="border-0">{{ beat.msg }}</td> <td class="border-0">{{ beat.msg }}</td>
@ -233,4 +233,16 @@ table {
overflow-wrap: break-word; overflow-wrap: break-word;
} }
} }
@media screen and (max-width: 1280px) {
.name-column {
min-width: 150px;
}
}
@media screen and (min-aspect-ratio: 4/3) {
.name-column {
min-width: 200px;
}
}
</style> </style>