update accent color and button text for accesibility

clay · Jun 8, 2018 · 2eee464 · 2eee464
1 parent bf6e755
commit 2eee464
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/styleguide/_colors.scss b/styleguide/_colors.scss
@@ -9,7 +9,7 @@ $published: $md-green;
 $pure-black: $md-black;
 $pure-white: $md-white;
 $brand-primary-color: $md-blue-grey;
-$brand-accent-color: $md-blue;
+$brand-accent-color: $md-blue-700;
 
 $text-opacity: .87;
 $text-alt-opacity: .54;
@@ -43,7 +43,7 @@ $chip-delete-color: rgba(0, 0, 0, 0.26);
 $chip-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 2px 1px -1px rgba(0, 0, 0, 0.12);
 
 // placeholders
-$placeholder-color: $md-blue;
+$placeholder-color: $brand-accent-color; // same as buttons
 $placeholder-bg-color: $md-blue-50;
 $permanent-placeholder-color: $md-blue-grey;
 $permanent-placeholder-bg-color: $md-blue-grey-50;

diff --git a/styleguide/keen-variables.scss b/styleguide/keen-variables.scss
@@ -42,6 +42,11 @@ $ui-modal-mask-background: rgba($pure-black, $modal-opacity);
   margin: 0;
 }
 
+.ui-button__content {
+  // 14px buttons with white on blue (A400) neet to be bold for accesibility
+  font-weight: 600;
+}
+
 // html element in edit mode gets a smaller base font size
 // this sets the base sizing for KeenUI components, as they all use rem
 html.component-selector-wrapper {