|
|
|
/* Swap to full width on mobile */ |
|
@media only screen and (max-width : @largestMobileScreen) { |
|
.ui.form:not(.unstackable) .two.fields:not(.unstackable) > .fields, |
|
.ui.form:not(.unstackable) .two.fields:not(.unstackable) > .field, |
|
.ui.form:not(.unstackable) .three.fields:not(.unstackable) > .fields, |
|
.ui.form:not(.unstackable) .three.fields:not(.unstackable) > .field, |
|
.ui.form:not(.unstackable) .four.fields:not(.unstackable) > .fields, |
|
.ui.form:not(.unstackable) .four.fields:not(.unstackable) > .field, |
|
.ui.form:not(.unstackable) .five.fields:not(.unstackable) > .fields, |
|
.ui.form:not(.unstackable) .five.fields:not(.unstackable) > .field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .two.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .three.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .four.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .five.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .six.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .seven.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .eight.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .nine.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .ten.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .eleven.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .twelve.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .thirteen.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .fourteen.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .fifteen.wide.field, |
|
.ui.form:not(.unstackable) .fields:not(.unstackable) > .sixteen.wide.field { |
|
width: @oneColumn !important; |
|
} |
|
.ui.form .fields { |
|
margin-bottom: 0em; |
|
} |
|
} |
|
|
Forms with one-wide fields do not stack properly:
This is because this CSS is missing the one-wide case:
Semantic-UI/src/definitions/collections/form.less
Lines 910 to 942 in 597843a
Are one-wide fields supposed to stack on mobile through some other mechanism? If not, I think the above line should be added so that they behave like all the others.