From f67cd74f01638e91f6d02aa3ac8185aa093c37b7 Mon Sep 17 00:00:00 2001 From: Yanlan Shen Date: Tue, 6 Nov 2018 09:58:16 +0800 Subject: luci-theme-rosy: Add a background picture Signed-off-by: Yanlan Shen --- .../htdocs/luci-static/rosy/mobile-loginBG.png | Bin 0 -> 30877 bytes 1 file changed, 0 insertions(+), 0 deletions(-) create mode 100644 themes/luci-theme-rosy/htdocs/luci-static/rosy/mobile-loginBG.png diff --git a/themes/luci-theme-rosy/htdocs/luci-static/rosy/mobile-loginBG.png b/themes/luci-theme-rosy/htdocs/luci-static/rosy/mobile-loginBG.png new file mode 100644 index 000000000..68d765e19 Binary files /dev/null and b/themes/luci-theme-rosy/htdocs/luci-static/rosy/mobile-loginBG.png differ -- cgit v1.2.3 From 641681fa3251a6ff5afb19210b0f6862f28d94bd Mon Sep 17 00:00:00 2001 From: Yanlan Shen Date: Tue, 6 Nov 2018 09:59:35 +0800 Subject: luci-theme-rosy: Modify the layout of the header and footer Signed-off-by: Yanlan Shen --- themes/luci-theme-rosy/luasrc/view/themes/rosy/footer.htm | 6 +++--- themes/luci-theme-rosy/luasrc/view/themes/rosy/header.htm | 9 +++++---- 2 files changed, 8 insertions(+), 7 deletions(-) diff --git a/themes/luci-theme-rosy/luasrc/view/themes/rosy/footer.htm b/themes/luci-theme-rosy/luasrc/view/themes/rosy/footer.htm index 3795d37cb..f0cbe4e96 100755 --- a/themes/luci-theme-rosy/luasrc/view/themes/rosy/footer.htm +++ b/themes/luci-theme-rosy/luasrc/view/themes/rosy/footer.htm @@ -25,6 +25,8 @@ local categories = disp.node_childs(tree) %> + + - - - \ No newline at end of file + diff --git a/themes/luci-theme-rosy/luasrc/view/themes/rosy/header.htm b/themes/luci-theme-rosy/luasrc/view/themes/rosy/header.htm index 62a34c04b..e7316770b 100644 --- a/themes/luci-theme-rosy/luasrc/view/themes/rosy/header.htm +++ b/themes/luci-theme-rosy/luasrc/view/themes/rosy/header.htm @@ -273,11 +273,12 @@
+
- <%- if luci.sys.process.info("uid") == 0 and luci.sys.user.getuser("root") and not luci.sys.user.getpasswd("root") then -%>

-- cgit v1.2.3 From a4e4f935e0a48c913dcc4b91c6a0e599c52fc0cc Mon Sep 17 00:00:00 2001 From: Yanlan Shen Date: Tue, 6 Nov 2018 10:00:40 +0800 Subject: luci-theme-rosy: Fix resolution-related styles Signed-off-by: Yanlan Shen --- .../htdocs/luci-static/rosy/cascade.css | 207 +++++++++++++-------- 1 file changed, 131 insertions(+), 76 deletions(-) diff --git a/themes/luci-theme-rosy/htdocs/luci-static/rosy/cascade.css b/themes/luci-theme-rosy/htdocs/luci-static/rosy/cascade.css index e621e633d..f6ee728c1 100644 --- a/themes/luci-theme-rosy/htdocs/luci-static/rosy/cascade.css +++ b/themes/luci-theme-rosy/htdocs/luci-static/rosy/cascade.css @@ -108,6 +108,7 @@ strong { html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; + position: relative; } body { @@ -118,8 +119,9 @@ body { html, body { margin: 0px; padding: 0px; - height: 100%; - font-family: sans-serif, "Helvetica Neue", Helvetica, Hiragino Sans GB; + height: auto; + min-height: 100%; + font-family: Microsoft Yahei, WenQuanYi Micro Hei, sans-serif, "Helvetica Neue", Helvetica, Hiragino Sans GB; } select { @@ -241,6 +243,15 @@ h4 { padding-bottom: 10px; } +.mobile-hide { + display: inline-block; +} + +.PC-hide { + width: 100%; + display: none; +} + .cbi-section { margin: 1rem 0 0 0; padding: 2rem; @@ -337,7 +348,7 @@ div > .table > .tbody > .tr:nth-of-type(2n) { border-radius: 20px; overflow: hidden; border: none !important; - background-color: #468ea485; + background-color: #9bc1cc; } .cbi-section .table #memtotal > div > div > div, @@ -412,7 +423,6 @@ td > table > tbody > tr > td, .btn, .cbi-button { margin: 0 .8rem .5rem 0; -webkit-appearance: none; - text-transform: uppercase; color: rgba(0, 0, 0, 0.87); background-color: #F0F0F0; transition: all 0.2s ease-in-out; @@ -538,6 +548,7 @@ td > table > tbody > tr > td, .container .cbi-map .cbi-tabmenu + div { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; + overflow: hidden; } .tabs { @@ -562,7 +573,7 @@ td > table > tbody > tr > td, .tabs > li[class~="active"], .tabs > li:hover { cursor: pointer; - background-color: #0099CC; + background-color: #337ab7; } .tabs > li[class~="active"] > a, @@ -634,7 +645,6 @@ td > table > tbody > tr > td, } .cbi-value { - padding: .5rem 0; display: inline-block; width: 100%; } @@ -1103,6 +1113,9 @@ td > .ifacebadge, overflow: hidden; border-radius: 20px; } +#iwsvg, #bwsvg { + margin-top: 1rem; +} .ifacebox { background-color: #f9f9f9; @@ -1503,7 +1516,30 @@ header > .container > .pull-right > * { } /* applyreboot fix */ - +#maincontainer { + text-align: center; +} +#maincontainer > #maincontent { + padding: 1rem; + margin: 0 auto; + border-radius: 10px; + display: inline-block; + max-width: 800px; + width: 40%; +} +#applyreboot-container { + margin-bottom: 1rem; +} +#applyreboot-section { + text-align: left; + background: #fff; + padding: 1rem; + border-radius: 10px; +} +#applyreboot-section > div { + margin: 1rem 0; + line-height: 1.5rem; +} #applyreboot-container { margin: 90px 2rem 2rem 2rem; } @@ -1513,30 +1549,15 @@ header > .container > .pull-right > * { line-height: 300%; } -#applyreboot-section .bar-container { - background: transparent; - height: 20px; - border: 1px solid #b7b7b7; - border-radius: 20px; -} -#applyreboot-section .bar-container .bar { - background: #F24C7C; - height: 100%; - border-radius: 20px; -} - /* Shared style */ -header, .main { - width: 100%; - position: absolute; -} header { - height: 70px; + height: 0; position: fixed; top: 0; left: 0; right: 0; z-index: 100; + overflow: hidden; } header { padding-right: 1rem; @@ -1700,7 +1721,7 @@ header .logout a { footer { text-align: right; - padding: 1rem; + padding-right: 1rem; color: #aaa; font-size: 0.8rem; text-shadow: 0px 0px 2px #BBB; @@ -1713,8 +1734,7 @@ footer { /* The style of the prompt message */ .alert-message { - padding: 20px 15%; - border: 1px solid #4A5368; + padding: 13px 11%; border-radius: 10px; background-color: #FFF; } @@ -1734,37 +1754,42 @@ footer { } .alert-message > h4 { - padding: 17px 0 17px 36px; + padding: 7px 0 7px 36px; margin: 0; font-weight: normal; - font-size: 22px; + font-size: 18px; background: url(./no-pwd.png) no-repeat left 43%/ 28px; display: inline-block; } .alert-message > p { - font-size: 16px; - line-height: 2rem; + font-size: 14px; + line-height: 1.5rem; } .alert-message a { - padding: 8px 0; - margin-top: 17px; + padding: 4px 0; + margin-top: 12px; width: 100%; background-color: transparent; color: #fff; - font-size: 18px; + font-size: 16px; border: 1px solid #fff; border-radius: 50px; } /* All styles of the login interface */ +.node-main-login { + height: auto; + min-height: 100%; + background: #fff url(./loginBG.png) no-repeat center center / cover; +} .node-main-login header { display: none; } .node-main-login .main { - height: 100%; + height: auto; } .node-main-login > .main > .main-left { display: none; @@ -1772,50 +1797,55 @@ footer { .node-main-login > .main > .main-right { width: 100%; - height: 100%; - background: #fff url(./loginBG.png) no-repeat center center / cover; + height: auto; + min-height: 100%; } .node-main-login > .main #maincontent { + position: absolute; + min-width: 492px; width: 100%; - height: 100%; + top: 47%; + left: 50%; + transform: translateX(-50%) translateY(-50%); + height: auto; text-align: center; } .node-main-login > .main .container { + padding: 0; width: 30%; - max-width: 600px; + max-width: 492px; display: inline-block; - position: absolute; - top: 50%; - left: 50%; - transform: translateX(-50%) translateY(-50%); } .node-main-login > .main .logoImg a { - margin: 0 0 20px 0; + margin: 0 0 18px 0; display: block; - font-size: 36px; + font-size: 30px; color: #fff; text-decoration: none; } +.node-main-login > .main .logoImg img:first-child { + width: 72px; +} .node-main-login .warning { - background-color: #3f4a62; - color: #E9E4E4; + background-color: #3E4A62; + color: #fff; } .node-main-login > .main form h2 { - margin: 20px 0 16px; + margin: 17px 0; padding: 0; font-size: 24px; - color: #FFFFFC; + color: #fff; font-weight: normal; border: 0; } .node-main-login > .main form .cbi-map-descr { - margin: 16px 0 13px; + margin: 0 0 12px; padding: 0; font-size: 12px; color: #B1B6BB; @@ -1839,7 +1869,7 @@ footer { } .node-main-login > .main form .cbi-value-field { - margin-bottom: 32px; + margin-bottom: 16px; display: block; width: 100%; position: relative; @@ -1849,7 +1879,7 @@ footer { padding-left: 48px; width: 100%; border: 1px solid #556270; - height: 48px; + height: 42px; border-radius: 50px; font-size: 20px; color: #9c9fa1; @@ -1914,8 +1944,12 @@ footer { /* Interface after login */ +.logged-in header { + height: 70px; +} .logged-in .main { background-color: #EBF1F6; + overflow: hidden; } .logged-in .main-right { padding: 0 1rem 3rem 0; @@ -1964,12 +1998,7 @@ footer { width: auto; border: none; background-color: #468EA4; -} - -@media screen and (max-height: 580px) { - .logoImg img { - height: 48px; - } + color: #fff; } @media screen and (max-width: 1600px) { @@ -2049,7 +2078,9 @@ footer { position: fixed; z-index: 100; right: 100%; + left: 0; top: 0; + bottom: 0; background: #0000007d; border-radius: 0; min-width: 0; @@ -2068,9 +2099,6 @@ footer { .node-main-login > .main .container { width: 60%; } - .node-main-login .main { - background: #354057; - } .showSide { padding: 0.1rem; @@ -2254,23 +2282,34 @@ footer { @media screen and (max-width: 768px) { - .node-main-login > .main > .main-right { - background: #354057; + .node-main-login { + background: none; } .node-main-login > .main .logoImg a { - font-size: 18px; - margin: 0 0 10px 0; + font-size: 30px; + margin: 12px 0 22px 0; + color: #354057; + } + + .node-main-login > .main #maincontent { + padding-top: 0; + padding-bottom: 1rem; + min-width: 100%; + top: 0; + transform: translateY(0) translateX(-50%); } .alert-message { padding: 8px 15%; } - .alert-message > h4, + .alert-message > h4{ + font-size: 14px; + } .alert-message > p, .alert-message a { - font-size: 14px; + font-size: 12px; } .a lert-message > h4 { @@ -2282,13 +2321,20 @@ footer { margin-top: 8px; } + .node-main-login .warning { + background-color: #F5F5F6; + color: #354057; + } + + .alert-message a { + color: #f24c7c; + background: #fff; + } + .node-main-login > .main form h2 { font-size: 16px; margin: 20px 0 16px; - } - - .node-main-login > .main .container { - min-width: 90%; + color: #354057; } .node-main-login > .main form .cbi-value-field input { @@ -2318,6 +2364,14 @@ footer { left: auto; right: 12px; } + + .mobile-hide { + display: none; + } + + .PC-hide { + display: inline-block; + } } @media screen and (max-width: 480px) { @@ -2364,10 +2418,6 @@ footer { font-size: 10px; } - .mobile-hide { - display: none; - } - .panel-title { font-size: 1.4rem; padding-bottom: 1rem; @@ -2392,6 +2442,7 @@ footer { font-family: inherit; min-width: inherit; background-color: #FFF; + border-radius: 20px; -webkit-overflow-scrolling: touch; } @@ -2404,6 +2455,10 @@ footer { margin-top: 1rem; } + .node-main-login > .main .container { + min-width: 90%; + } + .th, .td { flex-basis: 50%; } @@ -2437,7 +2492,7 @@ footer { } .alert-message { - padding: 8px 5%; + padding: 8px 10%; } } -- cgit v1.2.3 From 6caf05eee2c68dd4d532159587cc4baf363eaff1 Mon Sep 17 00:00:00 2001 From: Yanlan Shen Date: Fri, 9 Nov 2018 14:57:02 +0800 Subject: luci-theme-rosy: Bug fix for network-interfaces Signed-off-by: Yanlan Shen --- .../htdocs/luci-static/rosy/cascade.css | 32 +++++++++++++--------- .../htdocs/luci-static/rosy/js/script.js | 1 + 2 files changed, 20 insertions(+), 13 deletions(-) diff --git a/themes/luci-theme-rosy/htdocs/luci-static/rosy/cascade.css b/themes/luci-theme-rosy/htdocs/luci-static/rosy/cascade.css index f6ee728c1..0f835df4b 100644 --- a/themes/luci-theme-rosy/htdocs/luci-static/rosy/cascade.css +++ b/themes/luci-theme-rosy/htdocs/luci-static/rosy/cascade.css @@ -288,11 +288,11 @@ h4 { overflow: hidden; } -.table > .tbody > .tr > .td, -.table > .tbody > .tr > .th, -.table > .tfoot > .tr > .td, -.table > .tfoot > .tr > .th, -.table > .thead > .tr > .td, +.table > .tbody > .tr > .td, +.table > .tbody > .tr > .th, +.table > .tfoot > .tr > .td, +.table > .tfoot > .tr > .th, +.table > .thead > .tr > .td, .table > .thead > .tr > .th { padding: .5rem; border-top: 1px solid #ddd; @@ -341,8 +341,8 @@ div > .table > .tbody > .tr:nth-of-type(2n) { background-color: #f9f9f9; } -.cbi-section .table #memtotal > div, -.cbi-section .table #memfree > div, +.cbi-section .table #memtotal > div, +.cbi-section .table #memfree > div, .cbi-section .table #membuff > div, .cbi-section .table #conns > div { border-radius: 20px; @@ -351,8 +351,8 @@ div > .table > .tbody > .tr:nth-of-type(2n) { background-color: #9bc1cc; } -.cbi-section .table #memtotal > div > div > div, -.cbi-section .table #memfree > div > div > div, +.cbi-section .table #memtotal > div > div > div, +.cbi-section .table #memfree > div > div > div, .cbi-section .table #membuff > div > div > div, .cbi-section .table #conns > div > div > div { color: #fff !important; @@ -524,7 +524,7 @@ td > table > tbody > tr > td, /* table */ .container > .tabs, -.container > .tabs > li[class~="active"], +.container > .tabs > li[class~="active"], .container > .tabs > li:hover, .container > .cbi-tabmenu, .container > .cbi-tabmenu > li[class~="cbi-tab"], @@ -645,6 +645,7 @@ td > table > tbody > tr > td, } .cbi-value { + padding: 6px 0; display: inline-block; width: 100%; } @@ -1510,6 +1511,9 @@ header > .container > .pull-right > * { .node-network-network .cbi-rowstyle-2 .ifacebox-body { background-color: #fff; } +.lang_zh-cnInterfaces .container .cbi-map .cbi-tabmenu + div { + overflow: inherit; +} /* fix Network Wireless*/ .node-network-wireless .cbi-section-node { margin-bottom: 1rem; @@ -1944,11 +1948,13 @@ footer { /* Interface after login */ +.logged-in { + background-color: #EBF1F6; +} .logged-in header { height: 70px; } .logged-in .main { - background-color: #EBF1F6; overflow: hidden; } .logged-in .main-right { @@ -2249,7 +2255,7 @@ footer { .table .tr.cbi-rowstyle-1:nth-child(n), .table .tr:nth-child(n) { font-size: 12px; } - .node-network-firewall .table .tr.cbi-rowstyle-1:nth-child(n), + .node-network-firewall .table .tr.cbi-rowstyle-1:nth-child(n), .node-network-firewall .table .tr:nth-child(n) { border-radius: 20px; overflow: hidden; @@ -2274,7 +2280,7 @@ footer { border-bottom: 1px solid rgba(0, 0, 0, .26); } - .node-status-processes .table .tr.cbi-rowstyle-1:nth-child(n), + .node-status-processes .table .tr.cbi-rowstyle-1:nth-child(n), .node-status-processes .table .tr:nth-child(n) { border-radius: 20px; } diff --git a/themes/luci-theme-rosy/htdocs/luci-static/rosy/js/script.js b/themes/luci-theme-rosy/htdocs/luci-static/rosy/js/script.js index b50bc1798..11d3cd68a 100755 --- a/themes/luci-theme-rosy/htdocs/luci-static/rosy/js/script.js +++ b/themes/luci-theme-rosy/htdocs/luci-static/rosy/js/script.js @@ -268,5 +268,6 @@ $('.logged-in .main-right').width( $(window).width() - $('.logged-in .main-left').width() - 50 ); } + $('body.logged-in').css('min-height', $(window).height()); })(jQuery); -- cgit v1.2.3