From 05d100442bbdb18c57a768abddad3221a3fd22a0 Mon Sep 17 00:00:00 2001 From: Ansuel Smith Date: Wed, 11 Aug 2021 17:15:08 +0200 Subject: luci-theme-material: add support for modmenu Improve support for modmenu. Signed-off-by: Ansuel Smith --- .../htdocs/luci-static/material/cascade.css | 46 ++++++++++++++++++++++ .../htdocs/luci-static/resources/menu-material.js | 6 +-- .../luasrc/view/themes/material/footer.htm | 1 - .../luasrc/view/themes/material/header.htm | 3 ++ 4 files changed, 52 insertions(+), 4 deletions(-) (limited to 'themes/luci-theme-material') 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 c41afc5b6a..dbb2d148c5 100644 --- a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css +++ b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css @@ -430,6 +430,52 @@ header > .fill > .container > .status > * { cursor: pointer; } +.modemenu-buttons { + display: flex; + flex-wrap: wrap; + align-items: center; + color: #fff; + color: var(--header-color); + background: #09c; + background: var(--header-bg); + padding: .5rem; + transition: box-shadow .2s; + box-shadow: 0 2px 5px rgb(0 0 0 / 26%); +} + +#modemenu { + margin: 0.25rem; + display: flex; + align-items: center; + flex-wrap: wrap; +} + +#modemenu > li > a { + font-size: .8rem; + font-weight: bold; + padding: .3rem .8rem; + white-space: nowrap; + text-decoration: none; + text-transform: uppercase; + color: #fff !important; + border-radius: 3px; + background-color: #bfbfbf; + text-shadow: none; +} + +#modemenu > li > a.active { + background-color: #5bc0de !important; +} + +#modemenu > li.divider { + margin-left: .25rem; + margin-right: .25rem; + border: .5rem solid var(--submenu-bg-hover); + border-left: 1px solid var(--submenu-bg-hover); + border-right: 1px solid var(--submenu-bg-hover); + border-radius: 1rem; +} + #xhr_poll_status { display: flex; } diff --git a/themes/luci-theme-material/htdocs/luci-static/resources/menu-material.js b/themes/luci-theme-material/htdocs/luci-static/resources/menu-material.js index 3499d5d19f..a994c4f463 100644 --- a/themes/luci-theme-material/htdocs/luci-static/resources/menu-material.js +++ b/themes/luci-theme-material/htdocs/luci-static/resources/menu-material.js @@ -117,12 +117,12 @@ return baseclass.extend({ if (isActive) this.renderMainMenu(children[i], children[i].name); - if (i > 0 || i < children.length) + if (i > 0 && i < children.length) ul.appendChild(E('li', {'class': 'divider'}, [E('span')])) } - if (ul.children.length > 1) - ul.style.display = ''; + if (children.length > 1) + ul.parentElement.style.display = ''; }, renderTabMenu: function(tree, url, level) { diff --git a/themes/luci-theme-material/luasrc/view/themes/material/footer.htm b/themes/luci-theme-material/luasrc/view/themes/material/footer.htm index 4786b77452..f572504f4b 100644 --- a/themes/luci-theme-material/luasrc/view/themes/material/footer.htm +++ b/themes/luci-theme-material/luasrc/view/themes/material/footer.htm @@ -22,7 +22,6 @@ 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 1d9849a98a..2b890da034 100644 --- a/themes/luci-theme-material/luasrc/view/themes/material/header.htm +++ b/themes/luci-theme-material/luasrc/view/themes/material/header.htm @@ -72,6 +72,9 @@
<%:Collecting data...%>
+
-- cgit v1.2.3