MDL-56652 core_roles: Add BS4 styling to define roles form

This commit is contained in:
Simey Lameze 2016-10-31 12:23:15 +08:00
parent a6fa0d9c97
commit 2e1c739a28
7 changed files with 51 additions and 21 deletions

View File

@ -80,7 +80,8 @@ echo $OUTPUT->box($controller->get_intro_text());
echo '<form action="' . $baseurl . '" method="post">';
echo '<input type="hidden" name="sesskey" value="' . sesskey() . '" />';
echo html_writer::table($table);
echo '<div class="buttons"><input type="submit" name="submit" value="'.get_string('savechanges').'"/>';
echo '<div class="submitbuttons">';
echo '<input type="submit" class="btn btn-primary" name="submit" value="' . get_string('savechanges') . '"/>';
echo '</div></form>';
echo $OUTPUT->footer();

View File

@ -471,15 +471,17 @@ class core_role_define_role_table_advanced extends core_role_capability_table_wi
}
protected function get_name_field($id) {
return '<input type="text" id="' . $id . '" name="' . $id . '" maxlength="254" value="' . s($this->role->name) . '" />';
return '<input type="text" class="form-control" id="' . $id . '" name="' . $id . '" size="30"
value="' . s($this->role->name) . '" />';
}
protected function get_shortname_field($id) {
return '<input type="text" id="' . $id . '" name="' . $id . '" maxlength="254" value="' . s($this->role->shortname) . '" />';
return '<input type="text" class="form-control" id="' . $id . '" name="' . $id . '" size="30"
value="' . s($this->role->shortname) . '" />';
}
protected function get_description_field($id) {
return '<textarea class="form-textarea" id="'. s($id) .'" name="description" rows="10" cols="50">' .
return '<textarea class="form-textarea form-control" id="'. s($id) .'" name="description" rows="10" cols="50">' .
htmlspecialchars($this->role->description) .
'</textarea>';
}
@ -490,7 +492,8 @@ class core_role_define_role_table_advanced extends core_role_capability_table_wi
foreach (get_role_archetypes() as $type) {
$options[$type] = get_string('archetype'.$type, 'role');
}
return html_writer::select($options, 'archetype', $this->role->archetype, false);
return html_writer::select($options, 'archetype', $this->role->archetype, false,
array('class' => 'custom-select'));
}
protected function get_assignable_levels_control() {
@ -563,7 +566,8 @@ class core_role_define_role_table_advanced extends core_role_capability_table_wi
if ($this->roleid == 0) {
$options[-1] = get_string('thisnewrole', 'core_role');
}
return html_writer::select($options, 'allow'.$type.'[]', $selected, false, array('multiple'=>'multiple', 'size'=>10));
return html_writer::select($options, 'allow'.$type.'[]', $selected, false, array('multiple' => 'multiple',
'size' => 10, 'class' => 'form-control'));
}
/**
@ -575,11 +579,19 @@ class core_role_define_role_table_advanced extends core_role_capability_table_wi
return '';
}
protected function print_field($name, $caption, $field) {
/**
* Print labels, fields and help icon on role administration page.
*
* @param string $name The field name.
* @param string $caption The field caption.
* @param string $field The field type.
* @param null|string $helpicon The help icon content.
*/
protected function print_field($name, $caption, $field, $helpicon = null) {
global $OUTPUT;
// Attempt to generate HTML like formslib.
echo '<div class="fitem">';
echo '<div class="fitemtitle">';
echo '<div class="fitem row form-group">';
echo '<div class="fitemtitle col-md-3">';
if ($name) {
echo '<label for="' . $name . '">';
}
@ -587,13 +599,16 @@ class core_role_define_role_table_advanced extends core_role_capability_table_wi
if ($name) {
echo "</label>\n";
}
if ($helpicon) {
echo '<span class="pull-xs-right text-nowrap">'.$helpicon.'</span>';
}
echo '</div>';
if (isset($this->errors[$name])) {
$extraclass = ' error';
} else {
$extraclass = '';
}
echo '<div class="felement' . $extraclass . '">';
echo '<div class="felement col-md-9 form-inline' . $extraclass . '">';
echo $field;
if (isset($this->errors[$name])) {
echo $OUTPUT->error_text($this->errors[$name]);
@ -605,7 +620,8 @@ class core_role_define_role_table_advanced extends core_role_capability_table_wi
protected function print_show_hide_advanced_button() {
echo '<p class="definenotice">' . get_string('highlightedcellsshowdefault', 'core_role') . ' </p>';
echo '<div class="advancedbutton">';
echo '<input type="submit" name="toggleadvanced" value="' . get_string('hideadvanced', 'form') . '" />';
echo '<input type="submit" class="btn btn-secondary" name="toggleadvanced" value="' .
get_string('hideadvanced', 'form') . '" />';
echo '</div>';
}
@ -613,11 +629,14 @@ class core_role_define_role_table_advanced extends core_role_capability_table_wi
global $OUTPUT;
// Extra fields at the top of the page.
echo '<div class="topfields clearfix">';
$this->print_field('shortname', get_string('roleshortname', 'core_role').'&nbsp;'.$OUTPUT->help_icon('roleshortname', 'core_role'), $this->get_shortname_field('shortname'));
$this->print_field('name', get_string('customrolename', 'core_role').'&nbsp;'.$OUTPUT->help_icon('customrolename', 'core_role'), $this->get_name_field('name'));
$this->print_field('edit-description', get_string('customroledescription', 'core_role').'&nbsp;'.$OUTPUT->help_icon('customroledescription', 'core_role'),
$this->get_description_field('description'));
$this->print_field('menuarchetype', get_string('archetype', 'core_role').'&nbsp;'.$OUTPUT->help_icon('archetype', 'core_role'), $this->get_archetype_field('archetype'));
$this->print_field('shortname', get_string('roleshortname', 'core_role'),
$this->get_shortname_field('shortname'), $OUTPUT->help_icon('roleshortname', 'core_role'));
$this->print_field('name', get_string('customrolename', 'core_role'), $this->get_name_field('name'),
$OUTPUT->help_icon('customrolename', 'core_role'));
$this->print_field('edit-description', get_string('customroledescription', 'core_role'),
$this->get_description_field('description'), $OUTPUT->help_icon('customroledescription', 'core_role'));
$this->print_field('menuarchetype', get_string('archetype', 'core_role'), $this->get_archetype_field('archetype'),
$OUTPUT->help_icon('archetype', 'core_role'));
$this->print_field('', get_string('maybeassignedin', 'core_role'), $this->get_assignable_levels_control());
$this->print_field('menuallowassign', get_string('allowassign', 'core_role'), $this->get_allow_role_control('assign'));
$this->print_field('menuallowoverride', get_string('allowoverride', 'core_role'), $this->get_allow_role_control('override'));

View File

@ -37,7 +37,8 @@ class core_role_define_role_table_basic extends core_role_define_role_table_adva
protected function print_show_hide_advanced_button() {
echo '<div class="advancedbutton">';
echo '<input type="submit" name="toggleadvanced" value="' . get_string('showadvanced', 'form') . '" />';
echo '<input type="submit" class="btn btn-secondary" name="toggleadvanced"
value="' . get_string('showadvanced', 'form') . '" />';
echo '</div>';
}

View File

@ -252,7 +252,7 @@ if ($action === 'view') {
echo '<div class="mform">';
} else {
?>
<form id="rolesform" class="mform" action="<?php p($baseurl->out(false)); ?>" method="post"><div>
<form id="rolesform" class="mform fcontainer" action="<?php p($baseurl->out(false)); ?>" method="post"><div>
<input type="hidden" name="sesskey" value="<?php p(sesskey()) ?>" />
<input type="hidden" name="return" value="<?php p($return); ?>" />
<input type="hidden" name="resettype" value="none" />

View File

@ -45,17 +45,19 @@ M.core_role.init_cap_table_filter = function(Y, tableid, contextid) {
this.table = Y.one('#'+this.tableid);
// Create a div to hold the search UI.
this.div = Y.Node.create('<div class="capabilitysearchui"></div>').setStyles({
this.div = Y.Node.create('<div class="capabilitysearchui form-inline"></div>').setStyles({
width : this.table.get('offsetWidth'),
marginLeft : 'auto',
marginRight : 'auto'
});
// Create the capability search input.
this.input = Y.Node.create('<input type="text" id="'+this.table.get('id')+'capabilitysearch" value="'+Y.Escape.html(filtervalue)+'" />');
this.input = Y.Node.create('<input class="form-control m-x-1" type="text"' +
' id="'+this.table.get('id')+'capabilitysearch" value="'+Y.Escape.html(filtervalue)+'" />');
// Create a label for the search input.
this.label = Y.Node.create('<label for="'+this.input.get('id')+'">'+M.util.get_string('filter', 'moodle')+' </label>');
// Create a clear button to clear the input.
this.button = Y.Node.create('<input type="button" value="'+M.util.get_string('clear', 'moodle')+'" />').set('disabled', filtervalue=='');
this.button = Y.Node.create('<input type="button" class="btn btn-primary"' +
' value="'+M.util.get_string('clear', 'moodle')+'" />').set('disabled', filtervalue=='');
// Tie it all together
this.div.append(this.label).append(this.input).append(this.button);

View File

@ -156,6 +156,10 @@ img.iconsmall {
margin-right: auto;
}
.path-admin-roles .capabilitysearchui input[type="button"] {
margin-bottom: 0;
}
#page-admin-roles-define .topfields {
margin: 1em 0 2em;
}

View File

@ -2751,6 +2751,9 @@ img.iconsmall {
margin-left: auto;
margin-right: auto;
}
.path-admin-roles .capabilitysearchui input[type="button"] {
margin-bottom: 0;
}
#page-admin-roles-define .topfields {
margin: 1em 0 2em;
}