MDL-68963 theme_boost: fix safari focus outline for radio and checkbox
authorBas Brands <bas@moodle.com>
Mon, 8 Jun 2020 12:27:57 +0000 (14:27 +0200)
committerBas Brands <bas@moodle.com>
Mon, 8 Jun 2020 12:30:49 +0000 (14:30 +0200)
- safari does not support the custom styles for radios and
checkboxes added in MDL-67874

theme/boost/scss/moodle/core.scss
theme/boost/style/moodle.css
theme/classic/style/moodle.css

index afd70e8..ac58e81 100644 (file)
@@ -179,6 +179,17 @@ button.close {
     }
 }
 
     }
 }
 
+// Safari does not allow custom styling of checkboxes.
+.safari {
+    input[type="checkbox"],
+    input[type="radio"] {
+        &.focus,
+        &:focus {
+            outline: auto;
+        }
+    }
+}
+
 .usermenu,
 div.dropdown-item {
     a,
 .usermenu,
 div.dropdown-item {
     a,
index 811f3c1..c9fc671 100644 (file)
@@ -9807,6 +9807,11 @@ a.dropdown-toggle:focus:hover,
 button.close:focus:hover {
   text-decoration: none; }
 
 button.close:focus:hover {
   text-decoration: none; }
 
+.safari input[type="checkbox"].focus, .safari input[type="checkbox"]:focus,
+.safari input[type="radio"].focus,
+.safari input[type="radio"]:focus {
+  outline: auto; }
+
 .usermenu a,
 .usermenu a[role="button"],
 div.dropdown-item a,
 .usermenu a,
 .usermenu a[role="button"],
 div.dropdown-item a,
index 6404916..9dcb372 100644 (file)
@@ -10012,6 +10012,11 @@ a.dropdown-toggle:focus:hover,
 button.close:focus:hover {
   text-decoration: none; }
 
 button.close:focus:hover {
   text-decoration: none; }
 
+.safari input[type="checkbox"].focus, .safari input[type="checkbox"]:focus,
+.safari input[type="radio"].focus,
+.safari input[type="radio"]:focus {
+  outline: auto; }
+
 .usermenu a,
 .usermenu a[role="button"],
 div.dropdown-item a,
 .usermenu a,
 .usermenu a[role="button"],
 div.dropdown-item a,