Browse Source

Form fields (grouped field) now use negative margins like columns, this prevents middle rows in even sized fields being slightly smaller than other rows

pull/4005/head
Jack Lukic 9 years ago
parent
commit
4db2dd5ba6
2 changed files with 5 additions and 20 deletions
  1. 22
      src/definitions/collections/form.less
  2. 3
      src/themes/default/collections/form.variables

22
src/definitions/collections/form.less

@ -18,7 +18,6 @@
@import (multiple) '../../theme.config';
/*******************************
Elements
*******************************/
@ -750,7 +749,7 @@
.ui.form .fields {
display: flex;
flex-direction: row;
margin: @fieldMargin;
margin: @fieldsMargin;
}
.ui.form .fields > .field {
flex: 0 1 auto;
@ -824,19 +823,10 @@
.ui.form .ten.fields > .fields,
.ui.form .ten.fields > .field {
width: @oneColumn !important;
margin: @fieldMargin;
padding-left: 0%;
padding-right: 0%;
margin: @fieldsMargin;
}
}
.ui.form .fields .field:first-child {
padding-left: 0%;
}
.ui.form .fields .field:last-child {
padding-right: 0%;
}
/* Sizing Combinations */
.ui.form .fields .wide.field {
@ -844,12 +834,6 @@
padding-left: (@gutterWidth / 2);
padding-right: (@gutterWidth / 2);
}
.ui.form .fields .wide.field:first-child {
padding-left: 0%;
}
.ui.form .fields .wide.field:last-child {
padding-right: 0%;
}
.ui.form .one.wide.field {
width: @oneWide !important;
@ -926,8 +910,6 @@
.ui.form .fields > .fifteen.wide.field,
.ui.form .fields > .sixteen.wide.field {
width: @oneColumn !important;
padding-left: 0%;
padding-right: 0%;
}
}

3
src/themes/default/collections/form.variables

@ -16,6 +16,9 @@
/* Field */
@fieldMargin: 0em 0em @rowDistance;
/* Fields */
@fieldsMargin: 0em -(@gutterWidth / 2) @rowDistance;
/* Form Label */
@labelDistance: @4px;
@labelMargin: 0em 0em @labelDistance 0em;

Loading…
Cancel
Save