From fa0658da5ed1494732f9162d3346b381e13fbf64 Mon Sep 17 00:00:00 2001 From: Florian Eckert Date: Wed, 26 Sep 2018 10:42:09 +0200 Subject: [PATCH] luci-theme-material: add logo brand Signed-off-by: Florian Eckert Signed-off-by: Konrad Kreitmair --- .../htdocs/luci-static/material/brand.png | Bin 0 -> 7026 bytes .../htdocs/luci-static/material/cascade.css | 75 ++++++++---------- .../luasrc/view/themes/material/header.htm | 3 +- 3 files changed, 33 insertions(+), 45 deletions(-) create mode 100644 themes/luci-theme-material/htdocs/luci-static/material/brand.png diff --git a/themes/luci-theme-material/htdocs/luci-static/material/brand.png b/themes/luci-theme-material/htdocs/luci-static/material/brand.png new file mode 100644 index 0000000000000000000000000000000000000000..49fcb7d2579d5bb8acfe13ffa9e35f70614976a3 GIT binary patch literal 7026 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 QO8@`>07*qoM6N<$f*p4_asU7T literal 0 HcmV?d00001 diff --git a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css index fa0316343..c6e893715 100644 --- a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css +++ b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css @@ -183,7 +183,6 @@ header, .main { } header { - height: 4rem; box-shadow: 0 2px 5px rgba(0, 0, 0, .26); transition: box-shadow .2s; float: left; @@ -205,7 +204,7 @@ footer > a { } .main { - top: 4rem; + top: 5rem; bottom: 0rem; position: relative; height: 100%; @@ -255,7 +254,7 @@ footer > a { .main-left { float: left; - top: 4rem; + top: 5rem; width: 15%; width: calc(0% + 15rem); height: 100%; @@ -288,19 +287,36 @@ footer > a { header { background: var(--header-bg, #0099CC); color: var(--header-color, #FFFFFF); + height: 5rem; } header > .fill > .container { - margin-top: 0.5rem; - padding: 0.5rem 1rem 0 1rem; + padding-top: 0.25rem; + padding-right: 1rem; + padding-bottom: 0.25rem; + display: flex; + align-items: center; + height: 5rem; } header > .fill > .container > .brand { - font-size: 1.4rem; + font-size: 2rem; color: var(--header-color, #FFFFFF); text-decoration: none; cursor: default; - vertical-align: text-bottom; + margin-left: 1rem; +} + +header > .fill > .container > img{ + max-height: 4.5rem; + width: calc(0% + 13rem); + margin: 1rem; +} + +header > .fill > .container > .status { + display: flex; + justify-content: flex-end; + flex-grow: 8; } .danger { @@ -1537,6 +1553,10 @@ header > .container > .pull-right > * { background-color: #14CE14; } +#xhr_poll_status { + display: flex; +} + .label { padding: 0.3rem 0.8rem; font-size: 0.8rem; @@ -1749,14 +1769,6 @@ body.lang_pl.node-main-login .cbi-value-title { } @media screen and (max-width: 1600px) { - .main-left { - width: calc(0% + 13rem); - } - - .main-right { - width: calc(100% - 13rem); - } - .btn, .cbi-button { padding: 0.3rem 0.6rem; @@ -1790,29 +1802,10 @@ body.lang_pl.node-main-login .cbi-value-title { } @media screen and (max-width: 1280px) { - header { - height: 3.5rem; - } - header > .container { margin-top: 0.25rem; } - .main { - top: 3.5rem; - height: calc(100% - 3.5rem); - } - - .main-left { - width: calc(0% + 13rem); - top: 3.5rem; - height: calc(100% - 3.5rem); - } - - .main-right { - width: calc(100% - 13rem); - } - .cbi-tabmenu > li > a, .tabs > li > a { padding: 0.2rem 0.5rem; } @@ -1826,19 +1819,13 @@ body.lang_pl.node-main-login .cbi-value-title { font-size: 0.7rem !important; width: 100% !important; } - - .main > .main-left > .nav > li, - .main > .main-left > .nav > li a, - .main > .main-left > .nav > .slide > .menu { - font-size: 0.9rem; - } - - .main > .main-left > .nav > .slide > .slide-menu > li > a { - font-size: 0.7rem; - } } @media screen and (max-width: 992px) { + header > .fill > .container > img { + display: none; + } + .main-left { width: 0; position: fixed; diff --git a/themes/luci-theme-material/luasrc/view/themes/material/header.htm b/themes/luci-theme-material/luasrc/view/themes/material/header.htm index 564c680f1..1f1df9c9a 100644 --- a/themes/luci-theme-material/luasrc/view/themes/material/header.htm +++ b/themes/luci-theme-material/luasrc/view/themes/material/header.htm @@ -215,8 +215,9 @@
+ <%=boardinfo.hostname or "?"%> -
+
<% render_changes() %>