mirror of
https://github.com/louislam/uptime-kuma.git
synced 2024-12-17 19:54:39 -05:00
Fix: misc. layout fix on mobile
This commit is contained in:
parent
0bd1c42080
commit
62acd2edb1
@ -364,6 +364,12 @@ textarea.form-control {
|
||||
height: calc(100% - 65px);
|
||||
}
|
||||
|
||||
@media (max-width: 770px) {
|
||||
&.scrollbar {
|
||||
height: calc(100% - 40px);
|
||||
}
|
||||
}
|
||||
|
||||
.item {
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
|
@ -69,10 +69,22 @@ export default {
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
/**
|
||||
* Improve the sticky appearance of the list by increasing its
|
||||
* height as user scrolls down.
|
||||
* Not used on mobile.
|
||||
*/
|
||||
boxStyle() {
|
||||
return {
|
||||
height: `calc(100vh - 160px + ${this.windowTop}px)`,
|
||||
};
|
||||
if (window.innerWidth > 550) {
|
||||
return {
|
||||
height: `calc(100vh - 160px + ${this.windowTop}px)`,
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
height: "calc(100vh - 160px)",
|
||||
};
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
sortedMonitorList() {
|
||||
|
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<transition name="slide-fade" appear>
|
||||
<MonitorList />
|
||||
<MonitorList :scrollbar="true" />
|
||||
</transition>
|
||||
</template>
|
||||
|
||||
@ -14,3 +14,11 @@ export default {
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "../assets/vars";
|
||||
|
||||
.shadow-box {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
@ -65,12 +65,12 @@ const routes = [
|
||||
path: "/add",
|
||||
component: EditMonitor,
|
||||
},
|
||||
{
|
||||
path: "/list",
|
||||
component: List,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: "/list",
|
||||
component: List,
|
||||
},
|
||||
{
|
||||
path: "/settings",
|
||||
component: Settings,
|
||||
|
Loading…
Reference in New Issue
Block a user