From 5223c7c221cc049cfb00a148c2e1249bda0ca49a Mon Sep 17 00:00:00 2001 From: Jo-Philipp Wich Date: Sun, 22 Sep 2019 19:32:25 +0200 Subject: [PATCH] luci-theme-material: fix some severe styling issues Add some CSS band aids to fix styling and positioning of hidden tab panes, cbi maps in modal dialogs and nested cbi sections. Signed-off-by: Jo-Philipp Wich --- .../htdocs/luci-static/material/cascade.css | 25 +++++++++++++++++++ 1 file changed, 25 insertions(+) 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 91f87c69c1..a59e255a20 100644 --- a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css +++ b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css @@ -689,6 +689,7 @@ h5 { #cbi-network > .cbi-section-node, #cbi-wireless > .cbi-section-node, #cbi-wireless > #wifi_assoclist_table, +[data-tab-title], [data-page^="admin-system-admin"]:not(.node-main-login) .cbi-map:not(#cbi-dropbear), [data-page="admin-system-opkg"] #maincontent > .container { font-family: inherit; @@ -704,6 +705,12 @@ h5 { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .16), 0 0 2px 0 rgba(0, 0, 0, .12); } +.cbi-modal .cbi-section, +.cbi-section .cbi-section { + padding: 0; + box-shadow: none; +} + .cbi-map-descr, .cbi-section-descr { font-size: small; @@ -741,6 +748,15 @@ fieldset > fieldset, border-bottom: thin solid #eee; } +.cbi-section > h3:first-child, +.cbi-section > h4:first-child, +.cbi-section > p:first-child, +[data-tab-title] > h3:first-child, +[data-tab-title] > h4:first-child, +[data-tab-title] > p:first-child { + padding-top: 1rem; +} + table { border-spacing: 0; border-collapse: collapse; @@ -1119,6 +1135,8 @@ td > table > tbody > tr > td, overflow: hidden; height: 0; opacity: 0; + margin: 0; + padding: 0rem 1rem !important; } [data-tab-active="true"] { @@ -1126,6 +1144,7 @@ td > table > tbody > tr > td, height: auto; opacity: 1; transition: opacity .25s ease-in; + margin: inherit !important; } .cbi-section[id] .cbi-section-remove:nth-of-type(4n+3), @@ -1595,6 +1614,7 @@ body:not(.Interfaces) .cbi-rowstyle-2:first-child { .modal > * { line-height: normal; flex-basis: 100%; + margin-bottom: .5em; } .modal > pre, @@ -1651,6 +1671,11 @@ body:not(.Interfaces) .cbi-rowstyle-2:first-child { margin-bottom: 2em; } +.modal.cbi-modal { + max-width: 90%; + max-height: none; +} + body.modal-overlay-active { overflow: hidden; height: 100vh; -- 2.30.2