HFP-4115 fix summary submit button contrast (#166)

* HFP-4115 fix summary submit button contrast * HFP-4115 increased focus-visible border size so that chrome focus highlight does not completely cover it
h5p · Oct 24, 2024 · 4c7d5f8 · 4c7d5f8
1 parent 5aff0a4
commit 4c7d5f8
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/src/styles/_summary.scss b/src/styles/_summary.scss
@@ -217,13 +217,16 @@
     .h5p-interactive-book-summary-submit {
       background-color: #0E7C57;
       color: #ffffff;
-      border: 1px solid #0E7C57;
+      border: 4px solid #0E7C57;
       transition: background-color 150ms;
 
       &:hover {
         background-color: #0c694a;
       }
     }
+    .h5p-interactive-book-summary-submit:focus-visible {
+      border: 4px solid #FFF;
+    }
 
     .h5p-interactive-book-summary-restart {
       color: #757575;