From 03dbc76f837ebb522ce4377eb2720ee2de7e3bf3 Mon Sep 17 00:00:00 2001
From: 100stacks <100stacks@users.noreply.github.com>
Date: Thu, 11 Feb 2021 14:30:21 -0600
Subject: [PATCH] feat(button): update component specs

* remove button 2px `border-radius`
* update checkbox specs
* update radio specs
* update popover specs
---
 src/scss/_vars.scss                                 | 6 +++---
 src/scss/components/button/mixins/_hxButton.scss    | 1 -
 src/scss/components/button/mixins/_hxButtonBar.scss | 4 ++--
 src/scss/components/checkbox/_index.scss            | 5 +++++
 src/scss/components/popover/_index.scss             | 8 +++++---
 src/scss/components/radio/_index.scss               | 5 +++++
 6 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/src/scss/_vars.scss b/src/scss/_vars.scss
index 0f22ec981..91e49cbb7 100644
--- a/src/scss/_vars.scss
+++ b/src/scss/_vars.scss
@@ -151,12 +151,12 @@ $font-sans-serif: "Open Sans", "Roboto", "Helvetica Neue", "Helvetica", "Arial",
 $font-monospace: "Open Sans Condensed", "Roboto Mono", monospace;
 
 // ==== FOCUS STATE =====
-$focus-glow: 0 0 4px rgba($cyan-700, 0.5);
+$focus-glow: 0 0 4px rgba($blue-700, 0.5);
 $focus-glow-disabled: $focus-glow;
-$focus-glow-invalid: 0 0 4px rgba($red-900, 0.5);
+$focus-glow-invalid: 0 0 4px rgba($red-status-900, 0.5);
 
 $app-nav-width: 15rem;
-$corner-radius: 2px;
+//$corner-radius: 2px;  // Deprecated for Button- v2.0 Specs
 
 // ==== Z-INDEX =====
 $drawer-z-index: 50;
diff --git a/src/scss/components/button/mixins/_hxButton.scss b/src/scss/components/button/mixins/_hxButton.scss
index 3e28fe0a0..76d01fa4c 100644
--- a/src/scss/components/button/mixins/_hxButton.scss
+++ b/src/scss/components/button/mixins/_hxButton.scss
@@ -1,5 +1,4 @@
 @mixin hxButton($weight: secondary, $size: medium) {
-  border-radius: $corner-radius;
   display: inline-flex;
   justify-content: center;
 
diff --git a/src/scss/components/button/mixins/_hxButtonBar.scss b/src/scss/components/button/mixins/_hxButtonBar.scss
index 5373a71bc..4f89256f3 100644
--- a/src/scss/components/button/mixins/_hxButtonBar.scss
+++ b/src/scss/components/button/mixins/_hxButtonBar.scss
@@ -5,11 +5,11 @@
     border-radius: 0;
 
     &:first-child {
-      border-radius: $corner-radius 0 0 $corner-radius;
+      border-radius: 0;  // Removed - v2.0 Specs
     }
 
     &:last-child {
-      border-radius: 0 $corner-radius $corner-radius 0;
+      border-radius: 0; // Removed - v2.0 Specs
     }
 
     + .hxBtn {
diff --git a/src/scss/components/checkbox/_index.scss b/src/scss/components/checkbox/_index.scss
index 657b67343..5433e73be 100644
--- a/src/scss/components/checkbox/_index.scss
+++ b/src/scss/components/checkbox/_index.scss
@@ -26,6 +26,11 @@ hx-checkbox-control {
   }
 
   > label {
+    // Checkbox v2.0 specs
+    font-size: 1rem;
+    color: $gray-950;
+    font-weight: 400; // normal
+
     // grid child
     -ms-grid-column: 2;
     -ms-grid-row: 1;
diff --git a/src/scss/components/popover/_index.scss b/src/scss/components/popover/_index.scss
index d6135b1c9..dfae24e7c 100644
--- a/src/scss/components/popover/_index.scss
+++ b/src/scss/components/popover/_index.scss
@@ -36,11 +36,13 @@ hx-popover {
   }
 
   > header {
-    color: $gray-900;
+    color: $gray-950;
     flex-shrink: 0;
-    font-size: 1rem;
-    font-weight: 600;
+    line-height: 2rem;
+    font-size: 1.5rem;
+    font-weight: 400;
     padding: map-get($space, md);
+    padding-bottom: 0.5rem;
     text-transform: none;
   }
 
diff --git a/src/scss/components/radio/_index.scss b/src/scss/components/radio/_index.scss
index bd4231745..ae190396e 100644
--- a/src/scss/components/radio/_index.scss
+++ b/src/scss/components/radio/_index.scss
@@ -45,6 +45,11 @@ hx-radio-control {
 
   // facade + text
   > label {
+    // Radio v2.0 specs
+    font-size: 1rem;
+    color: $gray-950;
+    font-weight: 400; // normal
+
     // grid child
     -ms-grid-column: 2;
     -ms-grid-row: 1;