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>
(cherry picked from commit b11a7d8e49)
This commit is contained in:
Jo-Philipp Wich 2021-11-22 09:40:49 +01:00
parent 119cfee890
commit 18cc1c79d7

View file

@ -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 {
@ -2020,6 +2021,7 @@ table table td,
.td.cbi-section-actions {
text-align: right;
vertical-align: middle;
width: 15%;
}
.td.cbi-section-actions > * {
@ -2353,10 +2355,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; }