mirror of
				https://github.com/louislam/uptime-kuma.git
				synced 2025-11-04 13:46:13 +08:00 
			
		
		
		
	Fix: misc. layout fix on mobile
This commit is contained in:
		@@ -363,6 +363,12 @@ textarea.form-control {
 | 
			
		||||
        overflow-y: auto;
 | 
			
		||||
        height: calc(100% - 65px);
 | 
			
		||||
    }
 | 
			
		||||
    
 | 
			
		||||
    @media (max-width: 770px) {
 | 
			
		||||
        &.scrollbar {
 | 
			
		||||
            height: calc(100% - 40px);
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .item {
 | 
			
		||||
        display: block;
 | 
			
		||||
 
 | 
			
		||||
@@ -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,
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user