Browse Source

Fixed poor styling for selects and checkboxes on mobile

development
Godwin 8 years ago
committed by GitHub
parent
commit
04b01b4c33
  1. 40
      app/assets/stylesheets/_application.scss

40
app/assets/stylesheets/_application.scss

@ -642,13 +642,11 @@ input {
display: inline-block;
label {
float: left;
min-width: 7.5em;
}
&.vertical {
label {
float: none;
@include after {
top: -0.15em;
left: 0.05em;
}
}
}
@ -800,8 +798,6 @@ fieldset {
}
.fieldgroup {
@include _-(display, flex);
@include _-(display, inline-flex);
@include _(align-items, flex-end);
@include _(flex-wrap, wrap);
margin: 0 0 3em 1em;
@ -3155,6 +3151,7 @@ html[data-lingua-franca-example="html"] {
select {
display: block;
width: 100%;
height: 1.75em;
font-family: inherit;
font-size: 1.5em;
@ -3210,6 +3207,7 @@ html[data-lingua-franca-example="html"] {
select {
padding-right: 2.25em;
-webkit-appearance: none;
@include _(appearance, none);
}
@ -3688,6 +3686,34 @@ html[data-ontop] {
input:first-child + label {
border: 0.1em solid;
}
&.inline {
label {
float: left;
@include after {
top: -0.025em;
left: 0.175em;
}
}
&.vertical {
label {
float: none;
}
}
}
}
.fieldgroup {
@include _-(display, flex);
@include _-(display, inline-flex);
}
.select-field {
select {
width: auto;
}
}
.admin-blocks {

Loading…
Cancel
Save