From cef948595bb4a5e9f8a6dab7b95d582206296aab Mon Sep 17 00:00:00 2001
From: Bas Brands <bas@moodle.com>
Date: Tue, 16 Jun 2020 16:44:47 +0200
Subject: [PATCH] MDL-69069 theme_boost: color contrast for custom alerts

---
 theme/boost/scss/moodle/course.scss | 21 ++++++++++++---------
 theme/boost/style/moodle.css        | 24 +++++++++++++++++-------
 theme/classic/style/moodle.css      | 23 ++++++++++++++++-------
 3 files changed, 45 insertions(+), 23 deletions(-)

diff --git a/theme/boost/scss/moodle/course.scss b/theme/boost/scss/moodle/course.scss
index 67dccd8b7b5..a64a6723578 100644
--- a/theme/boost/scss/moodle/course.scss
+++ b/theme/boost/scss/moodle/course.scss
@@ -515,13 +515,15 @@ span.editinstructions {
     margin-left: 30px;
     font-size: $font-size-sm;
     padding: .1em .4em;
-    background-color: $state-info-bg;
-    color: $state-info-text;
     text-decoration: none;
     z-index: 9999;
+    border: $alert-border-width solid transparent;
 
-    @include box-shadow(2px 2px 5px 1px #ccc);
-    border: 1px solid $state-info-border;
+    @include alert-variant(
+        theme-color-level('info', $alert-bg-level),
+        theme-color-level('info', $alert-border-level),
+        theme-color-level('info', $alert-color-level)
+    );
 }
 
 /* Course drag and drop upload styles */
@@ -531,14 +533,15 @@ span.editinstructions {
     width: 40%;
     margin: 0 30%;
     padding: 6px;
-    border: 1px solid $state-info-border;
     text-align: center;
-    background: $state-info-bg;
-    color: $state-info-text;
     z-index: 1; // Required in order to have this above relatively positioned course content@mixin
+    border: $alert-border-width solid transparent;
 
-    @include box-shadow(2px 2px 5px 1px #ccc);
-    @include border-radius(8px);
+    @include alert-variant(
+        theme-color-level('info', $alert-bg-level),
+        theme-color-level('info', $alert-border-level),
+        theme-color-level('info', $alert-color-level)
+    );
 }
 
 .dndupload-preview {
diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css
index 1835db659ef..7ed95df47ce 100644
--- a/theme/boost/style/moodle.css
+++ b/theme/boost/style/moodle.css
@@ -12993,11 +12993,16 @@ span.editinstructions {
   margin-left: 30px;
   font-size: 0.8203125rem;
   padding: .1em .4em;
-  background-color: #def2f8;
-  color: #5bc0de;
   text-decoration: none;
   z-index: 9999;
-  border: 1px solid #d1edf6; }
+  border: 0 solid transparent;
+  color: #2f6473;
+  background-color: #def2f8;
+  border-color: #d1edf6; }
+  span.editinstructions hr {
+    border-top-color: #bce5f2; }
+  span.editinstructions .alert-link {
+    color: #20454f; }
 
 /* Course drag and drop upload styles */
 #dndupload-status {
@@ -13006,11 +13011,16 @@ span.editinstructions {
   width: 40%;
   margin: 0 30%;
   padding: 6px;
-  border: 1px solid #d1edf6;
   text-align: center;
-  background: #def2f8;
-  color: #5bc0de;
-  z-index: 1; }
+  z-index: 1;
+  border: 0 solid transparent;
+  color: #2f6473;
+  background-color: #def2f8;
+  border-color: #d1edf6; }
+  #dndupload-status hr {
+    border-top-color: #bce5f2; }
+  #dndupload-status .alert-link {
+    color: #20454f; }
 
 .dndupload-preview {
   color: #909090;
diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css
index 295517d180b..641af0d4d74 100644
--- a/theme/classic/style/moodle.css
+++ b/theme/classic/style/moodle.css
@@ -13233,11 +13233,16 @@ span.editinstructions {
   margin-left: 30px;
   font-size: 0.8203125rem;
   padding: .1em .4em;
-  background-color: #def2f8;
-  color: #5bc0de;
   text-decoration: none;
   z-index: 9999;
-  border: 1px solid #d1edf6; }
+  border: 0 solid transparent;
+  color: #2f6473;
+  background-color: #def2f8;
+  border-color: #d1edf6; }
+  span.editinstructions hr {
+    border-top-color: #bce5f2; }
+  span.editinstructions .alert-link {
+    color: #20454f; }
 
 /* Course drag and drop upload styles */
 #dndupload-status {
@@ -13246,12 +13251,16 @@ span.editinstructions {
   width: 40%;
   margin: 0 30%;
   padding: 6px;
-  border: 1px solid #d1edf6;
   text-align: center;
-  background: #def2f8;
-  color: #5bc0de;
   z-index: 1;
-  border-radius: 8px; }
+  border: 0 solid transparent;
+  color: #2f6473;
+  background-color: #def2f8;
+  border-color: #d1edf6; }
+  #dndupload-status hr {
+    border-top-color: #bce5f2; }
+  #dndupload-status .alert-link {
+    color: #20454f; }
 
 .dndupload-preview {
   color: #909090;