L-electron-Rare/moodle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

MDL-71947 theme_boost: fix styles for vertical forms

Browse Source
This commit is contained in:
Bas Brands
2021-06-24 12:32:05 +02:00
parent 0e64d1d00d
commit 64fb0a9587
4 changed files with 38 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/form/templates/element-template.mustache
+1 -1
View File
@@ -56,7 +56,7 @@
</span>
{{/element.staticlabel}}
{{/ label }}{{/ label}}
<div class="ml-1 ml-md-auto d-flex align-items-center align-self-start">
<div class="form-label-addon d-flex align-items-center align-self-start">
{{#required}}
<div class="text-danger" title="{{#str}}required{{/str}}">
{{#pix}}req, core, {{#str}}required{{/str}}{{/pix}}
theme/boost/scss/moodle/forms.scss
+15 -1
View File
@@ -371,7 +371,8 @@ textarea[data-auto-rows] {
margin-right: 0;
& > .col-md-3,
& > .col-md-9 {
float: none;
flex: 0 0 100%;
max-width: 100%;
width: inherit;
padding-right: 0;
padding-left: 0;
@@ -379,6 +380,19 @@ textarea[data-auto-rows] {
&.femptylabel > .col-md-3 {
display: none;
}
.form-control {
width: 100%;
}
}
}
.mform .col-form-label .form-label-addon {
margin-left: 0.25rem;
}
@include media-breakpoint-up(sm) {
.mform:not(.full-width-labels) .col-form-label .form-label-addon {
margin-left: auto;
}
}
theme/boost/style/moodle.css
+11 -1
View File
@@ -16677,12 +16677,22 @@ textarea[data-auto-rows] {
margin-right: 0; }
.mform.full-width-labels .fitem.row > .col-md-3,
.mform.full-width-labels .fitem.row > .col-md-9 {
float: none;
flex: 0 0 100%;
max-width: 100%;
width: inherit;
padding-right: 0;
padding-left: 0; }
.mform.full-width-labels .fitem.row.femptylabel > .col-md-3 {
display: none; }
.mform.full-width-labels .fitem.row .form-control {
width: 100%; }
.mform .col-form-label .form-label-addon {
margin-left: 0.25rem; }
@media (min-width: 576px) {
.mform:not(.full-width-labels) .col-form-label .form-label-addon {
margin-left: auto; } }
/** Allow wrapping an mform in a div with the form-inline class to have an inline, responsive form. */
@media (min-width: 768px) {
theme/classic/style/moodle.css
+11 -1
View File
@@ -16911,12 +16911,22 @@ textarea[data-auto-rows] {
margin-right: 0; }
.mform.full-width-labels .fitem.row > .col-md-3,
.mform.full-width-labels .fitem.row > .col-md-9 {
float: none;
flex: 0 0 100%;
max-width: 100%;
width: inherit;
padding-right: 0;
padding-left: 0; }
.mform.full-width-labels .fitem.row.femptylabel > .col-md-3 {
display: none; }
.mform.full-width-labels .fitem.row .form-control {
width: 100%; }
.mform .col-form-label .form-label-addon {
margin-left: 0.25rem; }
@media (min-width: 576px) {
.mform:not(.full-width-labels) .col-form-label .form-label-addon {
margin-left: auto; } }
/** Allow wrapping an mform in a div with the form-inline class to have an inline, responsive form. */
@media (min-width: 768px) {