MDL-55564 theme_noname: Override admin setting templates

Part of MDL-55071
mpetrowi · Sep 23, 2016 · 2c773bb · 2c773bb
1 parent df76022
commit 2c773bb
Show file tree

Hide file tree

Showing 18 changed files with 544 additions and 21 deletions.
diff --git a/theme/noname/scss/moodle/admin.scss b/theme/noname/scss/moodle/admin.scss
@@ -56,13 +56,16 @@
     display: none;
 }
 .statusok {
+    @extend .tag;
     @extend .tag-success;
 }
 .statuswarning {
+    @extend .tag;
     @extend .tag-warning;
 }
 .statusserious,
 .statuscritical {
+    @extend .tag;
     @extend .tag-danger;
 }
 
@@ -363,10 +366,6 @@
     margin-right: 7px;
 }
 
-.form-description {
-    clear: right;
-}
-
 .form-item .form-setting .form-htmlarea {
     display: inline;
 }
@@ -383,7 +382,6 @@
 }
 
 .form-item .form-setting .defaultsnext {
-    margin-right: 0.5em;
     display: inline;
 }
 
@@ -396,11 +394,11 @@
 .form-item .form-setting .form-password .unmask,
 .form-item .form-setting .form-defaultinfo {
     display: inline-block;
-}
 
-.form-item .pathok,
-.form-item .patherror {
-    margin-left: 0.5em;
+}
+.form-item .form-setting .form-defaultinfo {
+    max-width: 100%;
+    word-wrap: break-word;
 }
 
 #admin-emoticons td input {
@@ -435,6 +433,7 @@
     height: 102px;
     width: 410px;
     margin-bottom: 10px;
+    box-sizing: content-box;
 }
 
 .admin_colourpicker .loadingicon {

diff --git a/theme/noname/scss/moodle/forms.scss b/theme/noname/scss/moodle/forms.scss
@@ -54,12 +54,6 @@ input#id_externalurl {
     display: inline;
 }
 
-// Copying in Bootstrap styles.
-.form-item {
-    margin-bottom: 10px;
-    // Theres's a mysterious extra 10px inside this item,
-    // so reduce margin by 10px from 20px standard to compensate.
-}
 .form-defaultinfo,
 .form-label .form-shortname {
     @extend .text-muted;
@@ -68,28 +62,27 @@ input#id_externalurl {
     font-size: $font-size-xs;
     display: block;
 }
-.form-item .form-setting,
-.form-item .form-description,
+
 #page-mod-forum-search .c1 .form-horizontal {
     @extend .controls;
 }
 
+.form-item .form-inline {
+    display: inline;
+}
 
 .formsettingheading .form-horizontal {
     @extend .text-muted;
 }
+
 // Moodle doesn't differentiate between what Bootstrap calls
 // .uneditable-inputs and form help text. Styling them both as
 // uneditable looks ugly, styling both as form help is fairly
 // subtle in it's impact. Going for the latter as the best option.
-.form-item .form-description,
 .no-felement.fstatic {
     @extend .text-muted;
     padding-top: 5px;
 }
-.form-item .form-description {
-    padding-top: 0;
-}
 .no-fitem .fstaticlabel {
     font-weight: bold;
 }
@@ -109,6 +102,9 @@ div.backup-section + form,
 .form-buttons { // Add back the padding it would usually get from being inside a .form-horizontal.
     padding-left: $display1-size;
 }
+.form-item .form-setting .defaultsnext > input {
+    display: inline-block;
+}
 .form-item .form-setting .form-checkbox.defaultsnext {
     // Need to specify .defaultsnext and the .form-checkbox class
     // is somewhat randomly re-used on various actual checkboxes

diff --git a/theme/noname/scss/moodle/search.scss b/theme/noname/scss/moodle/search.scss
@@ -46,3 +46,12 @@
 .navbar .search-input-wrapper > form {
     margin: 5px 0 5px 25px;
 }
+
+.search-areas-actions {
+    margin-bottom: $spacer;
+}
+
+.search-areas-actions > div {
+    margin-right: $spacer;
+    display: inline-block;
+}
diff --git a/theme/noname/templates/core_admin/setting.mustache b/theme/noname/templates/core_admin/setting.mustache
@@ -0,0 +1,43 @@
+{{!
+    This file is part of Moodle - http://moodle.org/
+
+    Moodle is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    Moodle is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+}}
+{{!
+    Setting.
+}}
+<div class="form-item row" id="{{id}}">
+    <div class="form-label col-sm-3 text-sm-right">
+        <label {{#labelfor}}for="{{labelfor}}"{{/labelfor}}>
+            {{{title}}}
+            {{#override}}
+                <div class="form-overridden">{{override}}</div>
+            {{/override}}
+            {{#warning}}
+                <div class="form-warning">{{warning}}</div>
+            {{/warning}}
+        </label>
+        <span class="form-shortname d-block small text-muted">{{{name}}}</span>
+    </div>
+    <div class="form-setting col-sm-9">
+        {{#error}}
+            <div><span class="error">{{error}}</span></div>
+        {{/error}}
+        {{{element}}}
+        {{#default}}
+            <div class="form-defaultinfo text-muted">{{{default}}}</div>
+        {{/default}}
+        <div class="form-description m-t-1">{{{description}}}</div>
+    </div>
+</div>
diff --git a/theme/noname/templates/core_admin/setting_configcolourpicker.mustache b/theme/noname/templates/core_admin/setting_configcolourpicker.mustache
@@ -0,0 +1,30 @@
+{{!
+    This file is part of Moodle - http://moodle.org/
+
+    Moodle is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    Moodle is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+}}
+{{!
+    Setting configcolourpicker.
+}}
+<div class="form-colourpicker defaultsnext">
+    <div class="admin_colourpicker clearfix">
+        {{#icon}}
+            {{>core/pix_icon}}
+        {{/icon}}
+    </div>
+    <input type="text" name="{{name}}" id="{{id}}" value="{{value}}" size="12" class="form-control">
+    {{#haspreviewconfig}}
+        <input type="button" id="{{id}}_preview" value={{#quote}}{{#str}}preview{{/str}}{{/quote}} class="admin_colourpicker_preview">
+    {{/haspreviewconfig}}
+</div>
diff --git a/theme/noname/templates/core_admin/setting_configduration.mustache b/theme/noname/templates/core_admin/setting_configduration.mustache
@@ -0,0 +1,31 @@
+{{!
+    This file is part of Moodle - http://moodle.org/
+
+    Moodle is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    Moodle is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+}}
+{{!
+    Setting configduration.
+}}
+<div class="form-duration defaultsnext">
+    <div class="form-inline">
+        <input type="text" size="5" id="{{id}}v" name="{{name}}[v]" value="{{value}}" class="form-control">
+        <label class="sr-only" for="{{id}}u">{{#str}}durationunits, admin{{/str}}</label>
+        <select id="{{id}}u" name="{{name}}[u]" class="form-control">
+            {{#options}}
+                <option value="{{value}}" {{#selected}}selected{{/selected}}>{{name}}</option>
+            {{/options}}
+        </select>
+    </div>
+</div>
+
diff --git a/theme/noname/templates/core_admin/setting_configfile.mustache b/theme/noname/templates/core_admin/setting_configfile.mustache
@@ -0,0 +1,33 @@
+{{!
+    This file is part of Moodle - http://moodle.org/
+
+    Moodle is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    Moodle is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+}}
+{{!
+    Setting configfile.
+}}
+<div class="form-file defaultsnext">
+    <div class="form-inline">
+        <input type="text" name="{{name}}" id="{{id}}" size="{{size}}" value="{{value}}" class="form-control" {{#readonly}}readonly{{/readonly}}>
+        {{#showvalidity}}
+            {{#valid}}
+                <span class="text-success">&#x2714;</span>
+            {{/valid}}
+            {{^valid}}
+                <span class="text-danger">&#x2718;</span>
+            {{/valid}}
+        {{/showvalidity}}
+    </div>
+</div>
+
diff --git a/theme/noname/templates/core_admin/setting_configmultiselect.mustache b/theme/noname/templates/core_admin/setting_configmultiselect.mustache
@@ -0,0 +1,28 @@
+{{!
+    This file is part of Moodle - http://moodle.org/
+
+    Moodle is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    Moodle is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+}}
+{{!
+    Setting configmultiselect.
+}}
+<div class="form-select">
+    <input type="hidden" name="{{name}}[xxxxx]" value="1">
+    <select id="{{id}}" name="{{name}}[]" size="{{size}}" class="form-control" multiple>
+        {{#options}}
+            <option value="{{value}}" {{#selected}}selected{{/selected}}>{{name}}</option>
+        {{/options}}
+    </select>
+</div>
+
diff --git a/theme/noname/templates/core_admin/setting_configpasswordunmask.mustache b/theme/noname/templates/core_admin/setting_configpasswordunmask.mustache
@@ -0,0 +1,57 @@
+{{!
+    This file is part of Moodle - http://moodle.org/
+
+    Moodle is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    Moodle is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+}}
+{{!
+    Setting configpasswordunmask.
+}}
+<div class="form-password">
+    <input type="password" name="{{name}}" size="{{size}}" id="{{id}}" value="{{value}}" class="form-control d-inline-block">
+    <div class="unmask" id="{{id}}unmaskdiv"></div>
+</div>
+{{#js}}
+(function() {
+    var id = '{{id}}';
+    var unmaskid = id + 'unmask';
+    var unmaskdivid = id + 'unmaskdiv';
+    var unmaskstr = {{#quote}}{{#str}}unmaskpassword, form{{/str}}{{/quote}};
+    var is_ie = (navigator.userAgent.toLowerCase().indexOf("msie") != -1);
+
+    document.getElementById(id).setAttribute("autocomplete", "off");
+
+    var unmaskdiv = document.getElementById(unmaskdivid);
+
+    var unmaskchb = document.createElement("input");
+    unmaskchb.setAttribute("type", "checkbox");
+    unmaskchb.setAttribute("id", unmaskid);
+    unmaskchb.onchange = function() {unmaskPassword(id);};
+    unmaskdiv.appendChild(unmaskchb);
+
+    var unmasklbl = document.createElement("label");
+    unmasklbl.innerHTML = unmaskstr;
+    if (is_ie) {
+      unmasklbl.setAttribute("htmlFor", unmaskid);
+    } else {
+      unmasklbl.setAttribute("for", unmaskid);
+    }
+    unmaskdiv.appendChild(unmasklbl);
+
+    if (is_ie) {
+      // Ugly hack to work around the famous onchange IE bug.
+      unmaskchb.onclick = function() {this.blur();};
+      unmaskdiv.onclick = function() {this.blur();};
+    }
+})()
+{{/js}}
diff --git a/theme/noname/templates/core_admin/setting_configselect.mustache b/theme/noname/templates/core_admin/setting_configselect.mustache
@@ -0,0 +1,27 @@
+{{!
+    This file is part of Moodle - http://moodle.org/
+
+    Moodle is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    Moodle is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+}}
+{{!
+    Setting configselect.
+}}
+<div class="form-select defaultsnext">
+    <select id="{{id}}" name="{{name}}" class="custom-select">
+        {{#options}}
+            <option value="{{value}}" {{#selected}}selected{{/selected}}>{{name}}</option>
+        {{/options}}
+    </select>
+</div>
+