mirror_php/moodle
1
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-01-18 22:08:20 +01:00
Code Issues Projects Releases Wiki Activity

MDL-66700 theme: Add form inset capabiity

Browse Source 
Part of MDL-66074

This allows a button to be insert into the left or right of a form
element.
This commit is contained in:
Andrew Nicols 2019-10-02 12:47:46 +08:00 committed by Mathew May
parent d3b890f85e
commit 57732a1c8e
4 changed files with 50 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
theme/boost/scss/moodle/forms.scss
View File

@ -464,3 +464,30 @@ textarea[data-auto-rows] {
background-image: url([[pix:t/collapsed]]);
}
}
// Form inset on the left/right.
// Used to display an icon/button within the form control.
.input-group {
&.form-inset {
.form-inset-item {
@extend .position-absolute;
padding-top: calc(#{$input-padding-y} + #{$input-border-width});
z-index: 3;
}
&.form-inset-left {
.form-control {
@extend .pl-4;
}
}
&.form-inset-right {
.form-control {
@extend .pr-4;
}
.form-inset-item {
right: 0;
}
}
}
}

2
theme/boost/scss/moodle/layout.scss
View File

@ -4,7 +4,7 @@
position: fixed;
top: 0;
left: 0;
z-index: $zindex-modal;
z-index: $zindex-modal-backdrop;
overflow-x: hidden;
transition: 0.5s;
width: 100%;

15
theme/boost/style/moodle.css
View File

@ -7699,7 +7699,7 @@ button.bg-dark:focus {
.position-relative {
position: relative !important; }
.position-absolute {
.position-absolute, .input-group.form-inset .form-inset-item {
position: absolute !important; }
.position-fixed {
@ -8024,7 +8024,7 @@ button.bg-dark:focus {
.py-4 {
padding-top: 1.5rem !important; }
.pr-4,
.pr-4, .input-group.form-inset.form-inset-right .form-control,
.px-4 {
padding-right: 1.5rem !important; }
@ -8032,7 +8032,7 @@ button.bg-dark:focus {
.py-4 {
padding-bottom: 1.5rem !important; }
.pl-4,
.pl-4, .input-group.form-inset.form-inset-left .form-control,
.px-4 {
padding-left: 1.5rem !important; }
@ -16169,6 +16169,13 @@ textarea[data-auto-rows] {
/*rtl:remove*/
background-image: url([[pix:t/collapsed]]); } }
.input-group.form-inset .form-inset-item {
padding-top: calc(0.375rem + 1px);
z-index: 3; }
.input-group.form-inset.form-inset-right .form-inset-item {
right: 0; }
.pagelayout-login .card-title h2 img {
max-width: 100%;
max-height: 100px; }
@ -18220,7 +18227,7 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont
position: fixed;
top: 0;
left: 0;
z-index: 1050;
z-index: 1040;
overflow-x: hidden;
transition: 0.5s;
width: 100%;

15
theme/classic/style/moodle.css
View File

@ -7946,7 +7946,7 @@ button.bg-dark:focus {
.position-relative {
position: relative !important; }
.position-absolute {
.position-absolute, .input-group.form-inset .form-inset-item {
position: absolute !important; }
.position-fixed {
@ -8271,7 +8271,7 @@ button.bg-dark:focus {
.py-4 {
padding-top: 1.5rem !important; }
.pr-4,
.pr-4, .input-group.form-inset.form-inset-right .form-control,
.px-4 {
padding-right: 1.5rem !important; }
@ -8279,7 +8279,7 @@ button.bg-dark:focus {
.py-4 {
padding-bottom: 1.5rem !important; }
.pl-4,
.pl-4, .input-group.form-inset.form-inset-left .form-control,
.px-4 {
padding-left: 1.5rem !important; }
@ -16441,6 +16441,13 @@ textarea[data-auto-rows] {
/*rtl:remove*/
background-image: url([[pix:t/collapsed]]); } }
.input-group.form-inset .form-inset-item {
padding-top: calc(0.375rem + 1px);
z-index: 3; }
.input-group.form-inset.form-inset-right .form-inset-item {
right: 0; }
.pagelayout-login .card-title h2 img {
max-width: 100%;
max-height: 100px; }
@ -18460,7 +18467,7 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont
position: fixed;
top: 0;
left: 0;
z-index: 1050;
z-index: 1040;
overflow-x: hidden;
transition: 0.5s;
width: 100%;