mirror of
https://github.com/louislam/uptime-kuma.git
synced 2024-09-07 09:51:57 +00:00
Merge branch 'Ponkhy_master'
This commit is contained in:
commit
432388a905
@ -4,6 +4,7 @@ export default {
|
|||||||
return {
|
return {
|
||||||
system: (window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light",
|
system: (window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light",
|
||||||
userTheme: localStorage.theme,
|
userTheme: localStorage.theme,
|
||||||
|
userHeartbeatBar: localStorage.heartbeatBarTheme,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -13,6 +14,11 @@ export default {
|
|||||||
this.userTheme = "light";
|
this.userTheme = "light";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Default Heartbeat Bar
|
||||||
|
if (!this.userHeartbeatBar) {
|
||||||
|
this.userHeartbeatBar = "normal";
|
||||||
|
}
|
||||||
|
|
||||||
document.body.classList.add(this.theme);
|
document.body.classList.add(this.theme);
|
||||||
this.updateThemeColorMeta();
|
this.updateThemeColorMeta();
|
||||||
},
|
},
|
||||||
@ -35,6 +41,15 @@ export default {
|
|||||||
document.body.classList.remove(from);
|
document.body.classList.remove(from);
|
||||||
document.body.classList.add(this.theme);
|
document.body.classList.add(this.theme);
|
||||||
this.updateThemeColorMeta();
|
this.updateThemeColorMeta();
|
||||||
|
},
|
||||||
|
|
||||||
|
userHeartbeatBar(to, from) {
|
||||||
|
localStorage.heartbeatBarTheme = to;
|
||||||
|
},
|
||||||
|
|
||||||
|
heartbeatBarTheme(to, from) {
|
||||||
|
document.body.classList.remove(from);
|
||||||
|
document.body.classList.add(this.heartbeatBarTheme);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -13,17 +13,24 @@
|
|||||||
|
|
||||||
<router-link v-for="(item, index) in sortedMonitorList" :key="index" :to="monitorURL(item.id)" class="item" :class="{ 'disabled': ! item.active }" @click="$root.cancelActiveList">
|
<router-link v-for="(item, index) in sortedMonitorList" :key="index" :to="monitorURL(item.id)" class="item" :class="{ 'disabled': ! item.active }" @click="$root.cancelActiveList">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-6 col-md-8 small-padding">
|
<div class="col-6 col-md-8 small-padding" v-bind:class="{ 'monitorItem': $root.userHeartbeatBar == 'bottom' || $root.userHeartbeatBar == 'none' }">
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<Uptime :monitor="item" type="24" :pill="true" />
|
<Uptime :monitor="item" type="24" :pill="true" />
|
||||||
{{ item.name }}
|
{{ item.name }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6 col-md-4">
|
<div class="col-6 col-md-4" v-show="$root.userHeartbeatBar == 'normal'" :key="$root.userHeartbeatBar">
|
||||||
|
<HeartbeatBar size="small" :monitor-id="item.id" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row" v-if="$root.userHeartbeatBar == 'bottom'">
|
||||||
|
<div class="col-12">
|
||||||
<HeartbeatBar size="small" :monitor-id="item.id" />
|
<HeartbeatBar size="small" :monitor-id="item.id" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</router-link>
|
</router-link>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12 col-md-7 col-xl-8">
|
<div class="col-12 col-md-7 col-xl-8">
|
||||||
@ -146,4 +153,8 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.monitorItem {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
@ -322,6 +322,12 @@ export default {
|
|||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "../assets/vars.scss";
|
@import "../assets/vars.scss";
|
||||||
|
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
.badge {
|
||||||
|
margin-top: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 550px) {
|
@media (max-width: 550px) {
|
||||||
.functions {
|
.functions {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -26,6 +26,22 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="mb-3">
|
||||||
|
<label class="form-label">Theme - Heartbeat Bar</label>
|
||||||
|
<div>
|
||||||
|
<div class="btn-group" role="group" aria-label="Basic checkbox toggle button group">
|
||||||
|
<input id="btncheck4" v-model="$root.userHeartbeatBar" type="radio" class="btn-check" name="heartbeatBarTheme" autocomplete="off" value="normal">
|
||||||
|
<label class="btn btn-outline-primary" for="btncheck4">Normal</label>
|
||||||
|
|
||||||
|
<input id="btncheck5" v-model="$root.userHeartbeatBar" type="radio" class="btn-check" name="heartbeatBarTheme" autocomplete="off" value="bottom">
|
||||||
|
<label class="btn btn-outline-primary" for="btncheck5">Bottom</label>
|
||||||
|
|
||||||
|
<input id="btncheck6" v-model="$root.userHeartbeatBar" type="radio" class="btn-check" name="heartbeatBarTheme" autocomplete="off" value="none">
|
||||||
|
<label class="btn btn-outline-primary" for="btncheck6">None</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="mb-3">
|
<div class="mb-3">
|
||||||
<label for="timezone" class="form-label">Timezone</label>
|
<label for="timezone" class="form-label">Timezone</label>
|
||||||
<select id="timezone" v-model="$root.userTimezone" class="form-select">
|
<select id="timezone" v-model="$root.userTimezone" class="form-select">
|
||||||
|
Loading…
Reference in New Issue
Block a user