From 5920f6338de5f0b90fb7e9f9ffedfeaa0dba942b Mon Sep 17 00:00:00 2001 From: Jun Pataleta Date: Wed, 30 Nov 2016 16:50:06 +0800 Subject: [PATCH] MDL-57171 admin: Make environment check table look better * Use Bootstrap label classes for the text under the status column. * theme_bootstrapbase: - Cleanup unnecessary classes and make .error styles consistent with .warn styles * theme_boost: - Set font color appropriate for success, warning and error strings. * Enclose report text in div so that the feedback texts will be displayed right below it. --- admin/renderer.php | 13 +++- theme/boost/scss/moodle/admin.scss | 3 + theme/bootstrapbase/less/moodle/admin.less | 16 ++--- theme/bootstrapbase/style/moodle.css | 83 ++-------------------- 4 files changed, 23 insertions(+), 92 deletions(-) diff --git a/admin/renderer.php b/admin/renderer.php index 2b841d6acb7..32d28fd57e1 100644 --- a/admin/renderer.php +++ b/admin/renderer.php @@ -1899,14 +1899,21 @@ class core_admin_renderer extends plugin_renderer_base { } else { $report = $this->doc_link(join($linkparts, '/'), get_string($stringtouse, 'admin', $rec)); } + // Enclose report text in div so feedback text will be displayed underneath it. + $report = html_writer::div($report); // Format error or warning line - if ($errorline || $warningline) { - $messagetype = $errorline? 'error':'warn'; + if ($errorline) { + $messagetype = 'error'; + $statusclass = 'label-important'; + } else if ($warningline) { + $messagetype = 'warn'; + $statusclass = 'label-warning'; } else { $messagetype = 'ok'; + $statusclass = 'label-success'; } - $status = ''.$status.''; + $status = html_writer::span($status, 'label ' . $statusclass); // Here we'll store all the feedback found $feedbacktext = ''; // Append the feedback if there is some diff --git a/theme/boost/scss/moodle/admin.scss b/theme/boost/scss/moodle/admin.scss index 9330486264f..272184e7392 100644 --- a/theme/boost/scss/moodle/admin.scss +++ b/theme/boost/scss/moodle/admin.scss @@ -17,14 +17,17 @@ .environmenttable { .warn { background-color: $state-warning-bg; + color: $state-warning-text; } .error { background-color: $state-danger-bg; + color: $state-danger-text; } .ok { background-color: $state-success-bg; + color: $state-success-text; } } diff --git a/theme/bootstrapbase/less/moodle/admin.less b/theme/bootstrapbase/less/moodle/admin.less index 872d3742646..61947c9666d 100644 --- a/theme/bootstrapbase/less/moodle/admin.less +++ b/theme/bootstrapbase/less/moodle/admin.less @@ -15,23 +15,17 @@ } .environmenttable { - p.warn { + .warn { background-color: @warningBackground; color: @warningText; } - .error, - span.warn, - .ok { - .label; - } .error { - background-color: @errorText; - } - span.warn { - background-color: @orange; + background-color: @errorBackground; + color: @errorText; } .ok { - background-color: @successText; + background-color: @successBackground; + color: @successText; } } diff --git a/theme/bootstrapbase/style/moodle.css b/theme/bootstrapbase/style/moodle.css index aafcab49db8..b4e12cd71f8 100644 --- a/theme/bootstrapbase/style/moodle.css +++ b/theme/bootstrapbase/style/moodle.css @@ -2487,90 +2487,17 @@ h3.sectionname .inplaceeditable.inplaceeditingon .editinstructions { .path-admin .admintable .leftalign { text-align: left; } -.environmenttable p.warn { +.environmenttable .warn { background-color: #fcf8e3; color: #8a6d3b; } -.environmenttable .error, -.environmenttable span.warn, -.environmenttable .ok { - display: inline-block; - padding: 2px 4px; - font-size: 11.844px; - font-weight: bold; - line-height: 14px; - color: #fff; - vertical-align: baseline; - white-space: nowrap; - text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); - background-color: #999; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; -} -.environmenttable .error:empty, -.environmenttable span.warn:empty, -.environmenttable .ok:empty { - display: none; -} -.environmenttable .error-important, -.environmenttable span.warn-important, -.environmenttable .ok-important { - background-color: #b94a48; -} -.environmenttable .error-important[href], -.environmenttable span.warn-important[href], -.environmenttable .ok-important[href] { - background-color: #953b39; -} -.environmenttable .error-warning, -.environmenttable span.warn-warning, -.environmenttable .ok-warning { - background-color: #f89406; -} -.environmenttable .error-warning[href], -.environmenttable span.warn-warning[href], -.environmenttable .ok-warning[href] { - background-color: #c67605; -} -.environmenttable .error-success, -.environmenttable span.warn-success, -.environmenttable .ok-success { - background-color: #468847; -} -.environmenttable .error-success[href], -.environmenttable span.warn-success[href], -.environmenttable .ok-success[href] { - background-color: #356635; -} -.environmenttable .error-info, -.environmenttable span.warn-info, -.environmenttable .ok-info { - background-color: #3a87ad; -} -.environmenttable .error-info[href], -.environmenttable span.warn-info[href], -.environmenttable .ok-info[href] { - background-color: #2d6987; -} -.environmenttable .error-inverse, -.environmenttable span.warn-inverse, -.environmenttable .ok-inverse { - background-color: #333; -} -.environmenttable .error-inverse[href], -.environmenttable span.warn-inverse[href], -.environmenttable .ok-inverse[href] { - background-color: #1a1a1a; -} .environmenttable .error { - background-color: #b94a48; -} -.environmenttable span.warn { - background-color: #f89406; + background-color: #f2dede; + color: #b94a48; } .environmenttable .ok { - background-color: #468847; + background-color: #dff0d8; + color: #468847; } .path-admin .admintable.environmenttable .name, .path-admin .admintable.environmenttable .info,