moodle/moodle
3
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-08-07 01:46:45 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

MDL-44070 Conditional availability enhancements (8): display

Browse source 
Includes theme and renderer changes required for the new feature.
There are two parts: style required for the display as part of the
course page (when showing the list of conditions for an activity),
and style required for the settings form.

This change supports both the bootstrapbase theme (which was the
main theme used during development) and the old base theme.
This commit is contained in:
sam marshall 2014-03-26 13:24:58 +00:00
parent 400c0fd229
commit 00c832d7a1
5 changed files with 343 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

154
theme/bootstrapbase/less/moodle/forms.less
View file

@ -455,3 +455,157 @@ fieldset.coursesearchbox label {
}
}
}
/* Section and module editing forms contain special JS components for the
availability system (if enabled). */
#fitem_id_availabilityconditionsjson {
*[aria-hidden=true] {
display: none;
}
select,
input[type=text] {
position:relative;
top: 4px;
}
label {
display: inline;
}
.availability-group {
margin-right: 8px;
}
.availability-item {
margin-bottom: 6px;
}
.availability-none {
margin-left: 20px;
margin-bottom: 4px;
}
.availability-plugincontrols {
padding: 2px 0px 0px 4px;
background: none repeat scroll 0% 0% @wellBackground;
border: 1px solid @grayLighter;
border-radius: 4px;
display: inline-block;
margin-right: 8px;
}
/* Eye icon in front of an item and delete icon after it. */
.availability-eye,
.availability-delete {
margin-right: 8px;
}
/* Hidden eye icon still takes up space. */
.availability-eye[aria-hidden=true] {
display: inline;
visibility: hidden;
}
/* Eye icons in front of child lists are aligned specially. */
.availability-list > .availability-eye img {
vertical-align: top;
margin-top: 12px;
}
/* Add button lines up with child elements. */
.availability-button {
margin-left: 15px;
}
/* Nested section is grey. */
.availability-childlist > .availability-inner {
display: inline-block;
background: @wellBackground;
border: 1px solid @grayLighter;
border-radius: 4px;
padding: 6px;
margin-bottom: 6px;
}
/* Second (and more) levels of nested sections are white. */
.availability-childlist .availability-childlist > .availability-inner {
background: white;
}
/* Connecting text needs to be indented. */
.availability-connector {
margin-left: 20px;
margin-bottom: 6px;
}
}
.dir-rtl #fitem_id_availabilityconditionsjson {
.availability-group {
margin-right: 0;
margin-left: 8px;
}
.availability-none {
margin-right: 20px;
margin-left: 0;
}
.availability-plugincontrols {
padding-right: 4px;
padding-left: 0px;
margin-right: 0;
margin-left: 8px;
}
.availability-eye,
.availability-delete {
margin-left: 8px;
margin-right: 0;
}
.availability-button {
margin-right: 15px;
margin-left: 0;
}
.availability-connector {
margin-right: 20px;
margin-left: 0;
}
}
/* Default form styling colours all text red. With availability conditions
this looks excessive as we show 'Invalid' markers in specific places. */
.mform .error .availability-field {
color: @textColor;
}
/* This dialogue is used to add an availability condition. */
.availability-dialogue {
.moodle-dialogue .moodle-dialogue-bd {
padding-left: 0;
padding-right: 0;
padding-bottom: 2px;
}
ul {
display: block;
margin: 0;
}
li {
display: block;
list-style-type: none;
padding: 0 0 4px;
clear: both;
border-bottom: 1px solid @grayLighter;
margin-bottom: 4px;
}
ul button {
float: left;
margin-left: 1em;
min-width: 140px;
margin-top: 4px;
}
label {
margin-left: 170px;
margin-right: 1em;
margin-bottom: 0;
}
.availability-buttons button {
margin-left: 1em;
margin-right: 1em;
margin-top: 4px;
}
}
.dir-rtl .availability-dialogue {
ul button {
float: right;
margin-right: 1em;
margin-left: 0;
}
label {
margin-right: 170px;
margin-left: 1em;
}
}