luci-theme-bootstrap: various style corrections

 - Add proper top and bottom margin for tab descriptions
 - Allow flex wrapping for cbi-value rows
 - Ensure that nested table/grid sections always take the full width
 - Make table/grid section row action buttons are as narrow as possible

Signed-off-by: Jo-Philipp Wich <jo@mein.io>

diff --git a/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css b/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css
index c707479c48b3b619243b68326f6b6fb25c711e3b..85252160b105f380d0ceb2b629b18db5ee854f09 100644 (file)
--- a/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css
+++ b/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css
@@ -515,11 +515,6 @@ fieldset legend {
        padding-top: 20px;
 }
 
-form .cbi-tab-descr {
-       line-height: 18px;
-       margin-bottom: 18px;
-}
-
 label,
 input,
 button,
@@ -533,11 +528,13 @@ textarea {
 
 .cbi-value {
        display: flex;
+       flex-wrap: wrap;
        margin-bottom: 18px;
 }
 
 .cbi-value-field {
        margin-left: 20px;
+       flex: 1;
 }
 
 .cbi-value label.cbi-value-title {
@@ -549,6 +546,10 @@ textarea {
        color: var(--text-color-high);
 }
 
+.cbi-value > .cbi-tblsection {
+       width: 100%;
+}
+
 label > input[type="checkbox"],
 label > input[type="radio"] {
        vertical-align: text-top;
@@ -1241,8 +1242,8 @@ a.menu:after {
        font-weight: bold;
 }
 
-.cbi-tabcontainer > fieldset.cbi-section[id] > legend {
-       display: none;
+.cbi-tab-descr {
+       margin: -9px 0 18px 0;
 }
 
 .tabs .menu-dropdown, .tabs .dropdown-menu {
@@ -2021,6 +2022,7 @@ table table td,
 .td.cbi-section-actions {
        text-align: right;
        vertical-align: middle;
+       width: 15%;
 }
 
 .td.cbi-section-actions > * {
@@ -2354,10 +2356,6 @@ div.cbi-value var.cbi-tooltip-container,
        line-height: 300%;
 }
 
-[data-page="admin-network-dhcp"] [data-name="ip"] {
-       width: 15%;
-}
-
 @keyframes flash {
        0% { opacity: 1; }
        50% { opacity: .5; }