Difuse/luci
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

luci-theme-bootstrap: fix cbi-value caption alignment

Browse source 
Since the removal of the clearfix styles, overlong captions will displace
subsequent input field rows.

Fix the issue by replace floating label + field margin with flexbox styles.

Fixes: #5535
Fixes: 8055acc9be ("luci-theme-bootstrap: overhaul styles")
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
(cherry picked from commit 4720a025e8)
This commit is contained in:
Jo-Philipp Wich 2021-11-21 22:51:04 +01:00
parent 071a3b0d12
commit 119cfee890
2 changed files with 12 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css
View file

@ -502,11 +502,6 @@ pre {
/* Forms.less
* Base styles for various input types, form layouts, and states
* ------------------------------------------------------------- */
form,
.cbi-value {
margin-bottom: 18px;
}
fieldset {
margin-bottom: 9px;
padding-top: 9px;
@ -536,17 +531,20 @@ textarea {
line-height: normal;
}
form .input,
.cbi-value {
display: flex;
margin-bottom: 18px;
}
.cbi-value-field {
margin-left: 200px;
margin-left: 20px;
}
.cbi-value label.cbi-value-title {
padding-top: 6px;
font-size: 13px;
line-height: 18px;
float: left;
width: 180px;
flex: 0 0 180px;
text-align: right;
color: var(--text-color-high);
}

6
themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/mobile.css
View file

@ -161,6 +161,11 @@ header h3 a, header .brand {
padding-bottom: .5em;
border-bottom: 1px solid var(--border-color-high);
margin-bottom: .5em;
display: block;
}
.cbi-value.hidden {
display: none;
}
.cbi-value .cbi-value:last-child {
@ -170,7 +175,6 @@ header h3 a, header .brand {
}
.cbi-value label.cbi-value-title {
float: none;
font-weight: bold;
}