Merge pull request #20363 from shariquerik/5-column-form-layout

This commit is contained in:
Shariq Ansari 2023-03-16 18:04:44 +05:30 committed by GitHub
commit 4f2db72922
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 21 additions and 1 deletions

View file

@ -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")

View file

@ -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 {