7x31/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2025-08-21 16:15:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

UI improvements

Browse Source
This commit is contained in:
Karel Krýda
2022-05-08 20:03:24 +02:00
parent 9a35386841
commit ed218e73bb
5 changed files with 41 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/pages/Dashboard.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="container-fluid">
<div class="row">
<div v-if="! $root.isMobile" class="col-12 col-md-5 col-xl-4">
<div v-if="!$root.isMobile" class="col-12 col-md-5 col-xl-4">
<div class="dropdown dropdown-create">
<button class="btn btn-primary mb-3 dropdown-toggle" type="button" data-bs-toggle="dropdown">
<font-awesome-icon icon="plus" /> {{ $t("Create") }}
@@ -14,7 +14,7 @@
</li>
<li>
<button type="button" class="dropdown-item" @click="$router.push('/addMaintenance')">
<font-awesome-icon icon="exclamation-circle" /> {{ $t("Maintenance") }}
<font-awesome-icon icon="wrench" /> {{ $t("Maintenance") }}
</button>
</li>
</ul>
@@ -45,7 +45,32 @@ export default {
</script>
<style lang="scss" scoped>
@import "../assets/vars.scss";
.container-fluid {
width: 98%;
}
.dropdown-create {
display: flex;
justify-content: end;
}
.dark {
.dropdown-create {
ul {
background-color: $dark-bg;
border-color: $dark-bg2;
border-width: 2px;
li button {
color: $dark-font-color;
}
li button:hover {
background-color: $dark-bg2;
}
}
}
}
</style>

8
src/pages/MaintenanceDetails.vue
View File

@@ -22,14 +22,14 @@
<label for="affected_monitors" class="form-label" style="margin-top: 20px;">{{ $t("Affected Monitors") }}</label>
<br>
<button v-for="monitor in affectedMonitors" :key="monitor.id" class="btn btn-monitor" style="margin: 5px; cursor: auto; color: white; font-weight: bold;">
<button v-for="monitor in affectedMonitors" :key="monitor.id" class="btn btn-monitor" style="margin: 5px; cursor: auto; color: white; font-weight: 500;">
{{ monitor }}
</button>
<br />
<label for="selected_status_pages" class="form-label" style="margin-top: 20px;">{{ $t("Selected status pages") }}</label>
<br>
<button v-for="statusPage in selectedStatusPages" :key="statusPage.id" class="btn btn-monitor" style="margin: 5px; cursor: auto; color: white; font-weight: bold;">
<button v-for="statusPage in selectedStatusPages" :key="statusPage.id" class="btn btn-monitor" style="margin: 5px; cursor: auto; color: white; font-weight: 500;">
{{ statusPage }}
</button>
@@ -154,4 +154,8 @@ textarea {
background-color: #5cdd8b;
}
.dark .btn-monitor {
color: #020b05 !important;
}
</style>