Merge pull request #20363 from shariquerik/5-column-form-layout
This commit is contained in:
commit
4f2db72922
2 changed files with 21 additions and 1 deletions
|
|
@ -38,7 +38,12 @@ export default class Column {
|
|||
|
||||
resize_all_columns() {
|
||||
// distribute all columns equally
|
||||
let colspan = cint(12 / this.section.wrapper.find(".form-column").length);
|
||||
let columns = this.section.wrapper.find(".form-column").length;
|
||||
let colspan = cint(12 / columns);
|
||||
|
||||
if (columns == 5) {
|
||||
colspan = 20;
|
||||
}
|
||||
|
||||
this.section.wrapper
|
||||
.find(".form-column")
|
||||
|
|
|
|||
|
|
@ -409,6 +409,21 @@
|
|||
}
|
||||
}
|
||||
|
||||
// handle 5 columns in form
|
||||
.form-column.col-sm-20 {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
@media (min-width: map-get($grid-breakpoints, "sm")) {
|
||||
.form-column.col-sm-20 {
|
||||
flex: 0 0 20%;
|
||||
max-width: 20%;
|
||||
}
|
||||
}
|
||||
|
||||
// above mobile
|
||||
@media (min-width: map-get($grid-breakpoints, "md")) {
|
||||
.layout-main .form-column.col-sm-12 > form > .input-max-width {
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue