MDL-68404 gradingform_rubric: Style "Add level" button.

mgleeson · Apr 28, 2020 · e944a8f · e944a8f
1 parent f570a79
commit e944a8f
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 36 deletions.
diff --git a/grade/grading/form/rubric/renderer.php b/grade/grading/form/rubric/renderer.php
@@ -138,7 +138,7 @@ public function criterion_template($mode, $options, $elementname = '{NAME}', $cr
         if ($mode == gradingform_rubric_controller::DISPLAY_EDIT_FULL) {
             $value = get_string('criterionaddlevel', 'gradingform_rubric');
             $button = html_writer::empty_tag('input', array('type' => 'submit', 'name' => '{NAME}[criteria][{CRITERION-id}][levels][addlevel]',
-                'id' => '{NAME}-criteria-{CRITERION-id}-levels-addlevel', 'value' => $value));
+                'id' => '{NAME}-criteria-{CRITERION-id}-levels-addlevel', 'value' => $value, 'class' => 'btn btn-secondary'));
             $criteriontemplate .= html_writer::tag('td', $button, array('class' => 'addlevel'));
         }
         $displayremark = ($options['enableremarks'] && ($mode != gradingform_rubric_controller::DISPLAY_VIEW || $options['showremarksstudent']));

diff --git a/grade/grading/form/rubric/styles.css b/grade/grading/form/rubric/styles.css
@@ -219,15 +219,14 @@
 
 .gradingform_rubric.editor .addcriterion input,
 .gradingform_rubric.editor .addlevel input {
-    background: transparent url([[pix:t/add]]) no-repeat top left;
+    background: #fff url([[pix:t/add]]) no-repeat 7px 8px;
     display: block;
     color: #555;
     font-weight: bold;
     text-decoration: none;
 }
 
 .gradingform_rubric.editor .addcriterion input {
-    background-position: 5px 8px;
     height: 30px;
     line-height: 29px;
     margin-bottom: 14px;
@@ -236,11 +235,7 @@
 }
 
 .gradingform_rubric.editor .addlevel input {
-    background-position: 5px 5px;
-    height: 25px;
-    line-height: 24px;
-    margin-bottom: 45px;
-    padding-left: 18px;
+    padding-left: 24px;
     padding-right: 8px;
 }
 

diff --git a/theme/boost/scss/moodle/grade.scss b/theme/boost/scss/moodle/grade.scss
@@ -96,17 +96,6 @@
     }
 }
 
-.gradingform_rubric.editor {
-    .addlevel,
-    .addcriterion {
-        input {
-            // Fallback for IE8: we use Bootstrap 2's button styles normally, but
-            // IE8 ignores background-image: linear-gradient rules.
-            background: #fff none no-repeat top left;
-        }
-    }
-}
-
 #rubric-rubric {
     &.gradingform_rubric {
         #rubric-criteria {
@@ -185,12 +174,12 @@
                 }
 
                 .addlevel {
-                    vertical-align: middle;
+                    vertical-align: top;
+                    padding-top: 6px;
 
                     input {
-                        background-position: 0 0;
                         height: 30px;
-                        margin-right: 5px;
+                        line-height: 1rem;
                     }
                 }
             }

diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css
@@ -17398,10 +17398,6 @@ p.arrow_button {
 #page-grade-grading-form-rubric-edit .gradingform_rubric_editform .status {
   font-size: 70%; }
 
-.gradingform_rubric.editor .addlevel input,
-.gradingform_rubric.editor .addcriterion input {
-  background: #fff none no-repeat top left; }
-
 #rubric-rubric.gradingform_rubric #rubric-criteria {
   margin-bottom: 1em; }
   #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .description {
@@ -17445,11 +17441,11 @@ p.arrow_button {
     #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input.hiddenelement, #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input.pseudotablink {
       width: 0; }
   #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .addlevel {
-    vertical-align: middle; }
+    vertical-align: top;
+    padding-top: 6px; }
     #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .addlevel input {
-      background-position: 0 0;
       height: 30px;
-      margin-right: 5px; }
+      line-height: 1rem; }
 
 #rubric-rubric.gradingform_rubric .addcriterion {
   margin-left: 5px;

diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css
@@ -17630,10 +17630,6 @@ p.arrow_button {
 #page-grade-grading-form-rubric-edit .gradingform_rubric_editform .status {
   font-size: 70%; }
 
-.gradingform_rubric.editor .addlevel input,
-.gradingform_rubric.editor .addcriterion input {
-  background: #fff none no-repeat top left; }
-
 #rubric-rubric.gradingform_rubric #rubric-criteria {
   margin-bottom: 1em; }
   #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .description {
@@ -17677,11 +17673,11 @@ p.arrow_button {
     #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input.hiddenelement, #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input.pseudotablink {
       width: 0; }
   #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .addlevel {
-    vertical-align: middle; }
+    vertical-align: top;
+    padding-top: 6px; }
     #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .addlevel input {
-      background-position: 0 0;
       height: 30px;
-      margin-right: 5px; }
+      line-height: 1rem; }
 
 #rubric-rubric.gradingform_rubric .addcriterion {
   margin-left: 5px;