mirror of
https://github.com/moodle/moodle.git
synced 2025-03-14 04:30:15 +01:00
MDL-38691 form: Styling for show more/less toggle
This commit is contained in:
parent
83284dc962
commit
c55cd6ac64
21
lib/form/yui/showadvanced/showadvanced.js
vendored
21
lib/form/yui/showadvanced/showadvanced.js
vendored
@ -24,7 +24,13 @@ YUI.add('moodle-form-showadvanced', function(Y) {
|
||||
},
|
||||
CSS = {
|
||||
SHOW : 'show',
|
||||
MORELESSTOGGLER : 'morelesstoggler'
|
||||
MORELESSACTIONS: 'moreless-actions',
|
||||
MORELESSTOGGLER : 'moreless-toggler',
|
||||
SHOWLESS : 'moreless-less'
|
||||
},
|
||||
WRAPPERS = {
|
||||
FITEM : '<div class="fitem"></div>',
|
||||
FELEMENT : '<div class="felement"></div>'
|
||||
},
|
||||
ATTRS = {};
|
||||
|
||||
@ -73,15 +79,24 @@ YUI.add('moodle-form-showadvanced', function(Y) {
|
||||
fieldset.get('id') + "'", 'debug');
|
||||
return;
|
||||
}
|
||||
|
||||
var morelesslink = Y.Node.create('<a href="#"></a>');
|
||||
morelesslink.addClass(CSS.MORELESSTOGGLER);
|
||||
if (statuselement.get('value') === '0') {
|
||||
morelesslink.setHTML(M.str.form.showmore);
|
||||
} else {
|
||||
morelesslink.setHTML(M.str.form.showless);
|
||||
morelesslink.addClass(CSS.SHOWLESS);
|
||||
fieldset.all(SELECTORS.DIVFITEMADVANCED).addClass(CSS.SHOW);
|
||||
}
|
||||
fieldset.one(SELECTORS.DIVFCONTAINER).append(morelesslink);
|
||||
|
||||
var fitem = Y.Node.create(WRAPPERS.FITEM);
|
||||
fitem.addClass(CSS.MORELESSACTIONS);
|
||||
var felement = Y.Node.create(WRAPPERS.FELEMENT);
|
||||
felement.append(morelesslink);
|
||||
fitem.append(felement);
|
||||
|
||||
fieldset.one(SELECTORS.DIVFCONTAINER).append(fitem);
|
||||
},
|
||||
switch_state : function(e) {
|
||||
e.preventDefault();
|
||||
@ -93,9 +108,11 @@ YUI.add('moodle-form-showadvanced', function(Y) {
|
||||
// Invert it and change the link text.
|
||||
if (statuselement.get('value') === '0') {
|
||||
statuselement.set('value', 1);
|
||||
this.addClass(CSS.SHOWLESS);
|
||||
this.setHTML(M.util.get_string('showless', 'form'));
|
||||
} else {
|
||||
statuselement.set('value', 0);
|
||||
this.removeClass(CSS.SHOWLESS);
|
||||
this.setHTML(M.util.get_string('showmore', 'form'));
|
||||
}
|
||||
}
|
||||
|
@ -270,6 +270,9 @@ a.skip:active {position: static;display: block;}
|
||||
.mform fieldset.fdate_selector label {display:inline;float: none;width: auto;}
|
||||
.mform .ftags label.accesshide {display: block;position: static;}
|
||||
.mform .ftags select {margin-bottom: 0.7em;min-width: 22em;}
|
||||
.mform .moreless-toggler {background: url([[pix:t/more]]) left center no-repeat; padding-left: 16px;}
|
||||
.dir-rtl .moreless-toggler {padding-left: 0; padding-right: 16px; background-position: right center; }
|
||||
.mform .moreless-less {background-image: url([[pix:t/less]]);}
|
||||
.mform .helplink img { margin: 0 0 0 .45em; padding: 0;}
|
||||
.dir-rtl .mform .helplink img { margin: 0 .45em 0 0; padding: 0;}
|
||||
.mform legend .helplink img { margin-right: .2em; }
|
||||
|
Loading…
x
Reference in New Issue
Block a user