CHECKOUT-2461 Style optimized checkout new checklist radios buttons

bigcommerce · Sep 22, 2017 · 7c41a31 · 7c41a31
1 parent fce5072
commit 7c41a31
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 0 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,6 +1,7 @@
 # Changelog
 
 ## Draft
+- Style optimized checkout new checklist radio buttons [#dada](https://yadayada)
 
 ## 1.9.3 (2017-09-19)
 - Fixes image overlapping details on product page and Quick View on small viewports [#1067](https://github.com/bigcommerce/cornerstone/pull/1067)

diff --git a/assets/scss/optimized-checkout.scss b/assets/scss/optimized-checkout.scss
@@ -349,6 +349,26 @@ $optimizedCheckout-input--error-boxShadow: 0 0 3px transparentize(stencilColor("
     border-color: stencilColor("optimizedCheckout-formChecklist-borderColor");
 }
 
+.optimizedCheckout-form-checklist-checkbox {
+    & ~ .form-label::after,
+    & ~ .form-label::before {
+        border-color: stencilColor("optimizedCheckout-formField-borderColor");
+        background-color: stencilColor("optimizedCheckout-formField-backgroundColor");
+    }
+
+    &:focus ~ .form-label {
+        box-shadow: inset 0 0 0 1px stencilColor("optimizedCheckout-colorFocus");
+    }
+
+    &:checked ~ .form-label::before {
+        border-color: stencilColor("optimizedCheckout-formField-inputControlColor");
+    }
+
+    &:checked ~ .form-label::after {
+        background: stencilColor("optimizedCheckout-formField-inputControlColor");
+    }
+}
+
 //
 // Loading Toaster
 // Background & Text Color