Fix inline controls styling

This commit is contained in:
Alice Gaudon 2020-09-15 16:32:02 +02:00
parent 7664d36848
commit a3a19da038
1 changed files with 21 additions and 25 deletions

View File

@ -450,32 +450,38 @@ form {
height: calc(32px + 8px + 32px); height: calc(32px + 8px + 32px);
} }
&.inline .control { &.inline {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center;
input[type=checkbox] { .control {
width: min-content; display: flex;
height: min-content; flex-direction: row;
margin: 8px; align-items: center;
text-align: left; flex-grow: 1;
& ~ label { input[type=checkbox] {
position: static; width: min-content;
flex-grow: 1; height: min-content;
display: inline; margin: 8px;
padding: 8px;
font-size: 16px;
text-align: left; text-align: left;
& ~ label {
position: static;
flex-grow: 1;
display: inline;
padding: 8px;
font-size: 16px;
text-align: left;
}
} }
} }
} }
.input-group { .input-group {
display: flex; display: flex;
flex-shrink: 1; flex-grow: 1;
flex-direction: row; flex-direction: row;
div { div {
@ -484,19 +490,9 @@ form {
input { input {
width: 100%; width: 100%;
margin-top: 24px;
padding-top: 8px;
border: 0; border: 0;
background: transparent; background: transparent;
} }
> input + * {
position: absolute;
top: 32px;
right: 28px;
user-select: none;
text-align: right;
}
} }
} }
} }