diff --git a/grade/grading/form/rubric/styles.css b/grade/grading/form/rubric/styles.css index e45913bb5c8..99c9f561428 100644 --- a/grade/grading/form/rubric/styles.css +++ b/grade/grading/form/rubric/styles.css @@ -135,23 +135,6 @@ color: #aaa; } -.gradingform_rubric.editor .criterion .levels .level .delete { - position: absolute; - right: 0; -} - -.gradingform_rubric .criterion .levels .level .score { - font-style: italic; - color: #575; - font-weight: bold; - margin-top: 5px; - white-space: nowrap; -} - -.gradingform_rubric .criterion .levels .level .score .scorevalue { - padding-right: 5px; -} - /* Make invisible the buttons 'Move up' for the first criterion and 'Move down' for the last, because those buttons will make no change */ .gradingform_rubric.editor .criterion.first .controls .moveup input, @@ -159,20 +142,6 @@ display: none; } -/* evaluation */ -.gradingform_rubric .criterion .levels .level.currentchecked { - background: #fff0f0; -} - -.gradingform_rubric .criterion .levels .level.checked { - background: #d0ffd0; - border: 1px solid #555; -} - -.gradingform_rubric.evaluate .criterion .levels .level:hover { - background: #30ff30; -} - /* replace buttons with images */ .gradingform_rubric.editor .delete input, .gradingform_rubric.editor .duplicate input, diff --git a/mod/assign/styles.css b/mod/assign/styles.css index 24d0c72c524..07db38c778b 100644 --- a/mod/assign/styles.css +++ b/mod/assign/styles.css @@ -782,23 +782,6 @@ background-color: transparent; } -.path-mod-assign [data-region="grade-panel"] .gradingform_rubric.evaluate .criterion .levels .level:hover { - background-color: #dff0d8; -} - -.path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .levels .level.checked { - background-color: #dff0d8; - border: none; - border-left: 1px solid #ddd; -} - -.path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .levels .level .score { - color: #468847; - font-weight: 500; - font-style: normal; - margin-top: 20px; -} - .path-mod-assign [data-region="grade-panel"] .gradingform_rubric .criterion .remark textarea { margin-bottom: 0; } diff --git a/theme/boost/scss/moodle/grade.scss b/theme/boost/scss/moodle/grade.scss index d3b30e5bcdd..a272f6da92d 100644 --- a/theme/boost/scss/moodle/grade.scss +++ b/theme/boost/scss/moodle/grade.scss @@ -106,134 +106,158 @@ } } -#rubric-rubric { - &.gradingform_rubric { - #rubric-criteria { - margin-bottom: 1em; - $rubricPadding: 6px; +.gradingform_rubric { + margin-bottom: 1em; + $rubricPadding: 6px; - .criterion { - .description { - vertical-align: top; - padding: $rubricPadding; + // When doing evaluation on the rubrics table. + &.evaluate .criterion .levels .level { + &:hover, + &.checked { + background: #dff0d8; + } + &.checked { + border: none; + border-left: 1px solid $border-color; + } + } - textarea { - margin-bottom: 0; - height: 115px; - } - } + .criterion { + .description { + vertical-align: top; + padding: $rubricPadding; - .definition { - textarea { - width: 80%; - margin-bottom: 0; - } - } - - .score { - position: relative; - float: left; - margin-right: 28px; - - input { - margin-bottom: 0; - } - } - - .level { - vertical-align: top; - padding: $rubricPadding; - - .delete { - position: relative; - width: 32px; - height: 32px; - margin-top: -32px; - clear: both; - float: right; - - input { - display: block; - position: absolute; - right: 0; - bottom: 0; - height: 24px; - width: 24px; - margin: 0; - - &:hover { - background-color: #ddd; - } - } - } - } - - .scorevalue { - input { - // Should handle at least three chars with room to spare. - float: none; - width: 2em; - - &.hiddenelement, - &.pseudotablink { - // Zero out the width if it's still in the block flow for some reason - // when hidden - width: 0; - } - } - } - - .addlevel { - vertical-align: top; - padding-top: 6px; - - input { - height: 30px; - line-height: 1rem; - } - } + textarea { + margin-bottom: 0; + height: 115px; } } - .addcriterion { - margin-left: 5px; - padding: 0; + .definition { + textarea { + width: 80%; + margin-bottom: 0; + } + } + + .score { + position: relative; + float: left; + margin-top: 5px; + margin-right: 28px; + font-style: italic; + font-weight: bold; + color: #{theme-color-level('success', 2)}; + white-space: nowrap; input { - margin: 0; - color: inherit; - text-shadow: inherit; - border: 0 none; - line-height: inherit; - background: transparent url([[pix:t/add]]) no-repeat 7px 8px; - padding-left: 26px; + margin-bottom: 0; } - margin-bottom: 1em; } - .options { - clear: both; + .level { + vertical-align: top; + padding: $rubricPadding; - .option { - label { - margin: 0; - padding: 0; - font-size: inherit; - font-weight: normal; - line-height: 2em; - color: inherit; - text-shadow: none; - background-color: transparent; - } + &.currentchecked { + background: #fff0f0; + } + + &.checked { + background: #d0ffd0; + border: 1px solid #555; + } + + .delete { + position: relative; + width: 32px; + height: 32px; + margin-top: -32px; + clear: both; + float: right; input { - margin-left: 5px; - margin-right: 12px; + display: block; + position: absolute; + right: 0; + bottom: 0; + height: 24px; + width: 24px; + margin: 0; + + &:hover { + background-color: #ddd; + } } } } + + .scorevalue { + padding-right: 5px; + input { + // Should handle at least three chars with room to spare. + float: none; + width: 2em; + + &.hiddenelement, + &.pseudotablink { + // Zero out the width if it's still in the block flow for some reason + // when hidden + width: 0; + } + } + } + + .addlevel { + vertical-align: top; + padding-top: 6px; + + input { + height: 30px; + line-height: 1rem; + } + } + } + + .addcriterion { + margin-left: 5px; + padding: 0; + + input { + margin: 0; + color: inherit; + text-shadow: inherit; + border: 0 none; + line-height: inherit; + background: transparent url([[pix:t/add]]) no-repeat 7px 8px; + padding-left: 26px; + } + margin-bottom: 1em; + } + + .options { + clear: both; + + .option { + label { + margin: 0; + padding: 0; + font-size: inherit; + font-weight: normal; + line-height: 2em; + color: inherit; + text-shadow: none; + background-color: transparent; + } + + input { + margin-left: 5px; + margin-right: 12px; + } + } } } + .grade-display { .description { font-size: 1rem; diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css index c7f28338393..803c80d2437 100644 --- a/theme/boost/style/moodle.css +++ b/theme/boost/style/moodle.css @@ -19370,34 +19370,49 @@ p.arrow_button { #page-grade-grading-form-rubric-edit .gradingform_rubric_editform .status { font-size: 70%; } -#rubric-rubric.gradingform_rubric #rubric-criteria { +.gradingform_rubric { margin-bottom: 1em; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .description { + .gradingform_rubric.evaluate .criterion .levels .level:hover, .gradingform_rubric.evaluate .criterion .levels .level.checked { + background: #dff0d8; } + .gradingform_rubric.evaluate .criterion .levels .level.checked { + border: none; + border-left: 1px solid #dee2e6; } + .gradingform_rubric .criterion .description { vertical-align: top; padding: 6px; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .description textarea { + .gradingform_rubric .criterion .description textarea { margin-bottom: 0; height: 115px; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .definition textarea { + .gradingform_rubric .criterion .definition textarea { width: 80%; margin-bottom: 0; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .score { + .gradingform_rubric .criterion .score { position: relative; float: left; - margin-right: 28px; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .score input { + margin-top: 5px; + margin-right: 28px; + font-style: italic; + font-weight: bold; + color: #2d662a; + white-space: nowrap; } + .gradingform_rubric .criterion .score input { margin-bottom: 0; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .level { + .gradingform_rubric .criterion .level { vertical-align: top; padding: 6px; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .level .delete { + .gradingform_rubric .criterion .level.currentchecked { + background: #fff0f0; } + .gradingform_rubric .criterion .level.checked { + background: #d0ffd0; + border: 1px solid #555; } + .gradingform_rubric .criterion .level .delete { position: relative; width: 32px; height: 32px; margin-top: -32px; clear: both; float: right; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .level .delete input { + .gradingform_rubric .criterion .level .delete input { display: block; position: absolute; right: 0; @@ -19405,47 +19420,47 @@ p.arrow_button { height: 24px; width: 24px; margin: 0; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .level .delete input:hover { + .gradingform_rubric .criterion .level .delete input:hover { background-color: #ddd; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input { - float: none; - width: 2em; } - #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 { + .gradingform_rubric .criterion .scorevalue { + padding-right: 5px; } + .gradingform_rubric .criterion .scorevalue input { + float: none; + width: 2em; } + .gradingform_rubric .criterion .scorevalue input.hiddenelement, .gradingform_rubric .criterion .scorevalue input.pseudotablink { + width: 0; } + .gradingform_rubric .criterion .addlevel { vertical-align: top; padding-top: 6px; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .addlevel input { + .gradingform_rubric .criterion .addlevel input { height: 30px; line-height: 1rem; } - -#rubric-rubric.gradingform_rubric .addcriterion { - margin-left: 5px; - padding: 0; - margin-bottom: 1em; } - #rubric-rubric.gradingform_rubric .addcriterion input { - margin: 0; - color: inherit; - text-shadow: inherit; - border: 0 none; - line-height: inherit; - background: transparent url([[pix:t/add]]) no-repeat 7px 8px; - padding-left: 26px; } - -#rubric-rubric.gradingform_rubric .options { - clear: both; } - #rubric-rubric.gradingform_rubric .options .option label { - margin: 0; - padding: 0; - font-size: inherit; - font-weight: normal; - line-height: 2em; - color: inherit; - text-shadow: none; - background-color: transparent; } - #rubric-rubric.gradingform_rubric .options .option input { + .gradingform_rubric .addcriterion { margin-left: 5px; - margin-right: 12px; } + padding: 0; + margin-bottom: 1em; } + .gradingform_rubric .addcriterion input { + margin: 0; + color: inherit; + text-shadow: inherit; + border: 0 none; + line-height: inherit; + background: transparent url([[pix:t/add]]) no-repeat 7px 8px; + padding-left: 26px; } + .gradingform_rubric .options { + clear: both; } + .gradingform_rubric .options .option label { + margin: 0; + padding: 0; + font-size: inherit; + font-weight: normal; + line-height: 2em; + color: inherit; + text-shadow: none; + background-color: transparent; } + .gradingform_rubric .options .option input { + margin-left: 5px; + margin-right: 12px; } .grade-display .description { font-size: 1rem; } diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css index 13fd887f2c0..059828603d1 100644 --- a/theme/classic/style/moodle.css +++ b/theme/classic/style/moodle.css @@ -19370,34 +19370,49 @@ p.arrow_button { #page-grade-grading-form-rubric-edit .gradingform_rubric_editform .status { font-size: 70%; } -#rubric-rubric.gradingform_rubric #rubric-criteria { +.gradingform_rubric { margin-bottom: 1em; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .description { + .gradingform_rubric.evaluate .criterion .levels .level:hover, .gradingform_rubric.evaluate .criterion .levels .level.checked { + background: #dff0d8; } + .gradingform_rubric.evaluate .criterion .levels .level.checked { + border: none; + border-left: 1px solid #dee2e6; } + .gradingform_rubric .criterion .description { vertical-align: top; padding: 6px; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .description textarea { + .gradingform_rubric .criterion .description textarea { margin-bottom: 0; height: 115px; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .definition textarea { + .gradingform_rubric .criterion .definition textarea { width: 80%; margin-bottom: 0; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .score { + .gradingform_rubric .criterion .score { position: relative; float: left; - margin-right: 28px; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .score input { + margin-top: 5px; + margin-right: 28px; + font-style: italic; + font-weight: bold; + color: #2d662a; + white-space: nowrap; } + .gradingform_rubric .criterion .score input { margin-bottom: 0; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .level { + .gradingform_rubric .criterion .level { vertical-align: top; padding: 6px; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .level .delete { + .gradingform_rubric .criterion .level.currentchecked { + background: #fff0f0; } + .gradingform_rubric .criterion .level.checked { + background: #d0ffd0; + border: 1px solid #555; } + .gradingform_rubric .criterion .level .delete { position: relative; width: 32px; height: 32px; margin-top: -32px; clear: both; float: right; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .level .delete input { + .gradingform_rubric .criterion .level .delete input { display: block; position: absolute; right: 0; @@ -19405,47 +19420,47 @@ p.arrow_button { height: 24px; width: 24px; margin: 0; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .level .delete input:hover { + .gradingform_rubric .criterion .level .delete input:hover { background-color: #ddd; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .scorevalue input { - float: none; - width: 2em; } - #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 { + .gradingform_rubric .criterion .scorevalue { + padding-right: 5px; } + .gradingform_rubric .criterion .scorevalue input { + float: none; + width: 2em; } + .gradingform_rubric .criterion .scorevalue input.hiddenelement, .gradingform_rubric .criterion .scorevalue input.pseudotablink { + width: 0; } + .gradingform_rubric .criterion .addlevel { vertical-align: top; padding-top: 6px; } - #rubric-rubric.gradingform_rubric #rubric-criteria .criterion .addlevel input { + .gradingform_rubric .criterion .addlevel input { height: 30px; line-height: 1rem; } - -#rubric-rubric.gradingform_rubric .addcriterion { - margin-left: 5px; - padding: 0; - margin-bottom: 1em; } - #rubric-rubric.gradingform_rubric .addcriterion input { - margin: 0; - color: inherit; - text-shadow: inherit; - border: 0 none; - line-height: inherit; - background: transparent url([[pix:t/add]]) no-repeat 7px 8px; - padding-left: 26px; } - -#rubric-rubric.gradingform_rubric .options { - clear: both; } - #rubric-rubric.gradingform_rubric .options .option label { - margin: 0; - padding: 0; - font-size: inherit; - font-weight: normal; - line-height: 2em; - color: inherit; - text-shadow: none; - background-color: transparent; } - #rubric-rubric.gradingform_rubric .options .option input { + .gradingform_rubric .addcriterion { margin-left: 5px; - margin-right: 12px; } + padding: 0; + margin-bottom: 1em; } + .gradingform_rubric .addcriterion input { + margin: 0; + color: inherit; + text-shadow: inherit; + border: 0 none; + line-height: inherit; + background: transparent url([[pix:t/add]]) no-repeat 7px 8px; + padding-left: 26px; } + .gradingform_rubric .options { + clear: both; } + .gradingform_rubric .options .option label { + margin: 0; + padding: 0; + font-size: inherit; + font-weight: normal; + line-height: 2em; + color: inherit; + text-shadow: none; + background-color: transparent; } + .gradingform_rubric .options .option input { + margin-left: 5px; + margin-right: 12px; } .grade-display .description { font-size: 1rem; }