From dca6b9e05276672e5e3717a7a78f6124f9651c58 Mon Sep 17 00:00:00 2001
From: Alex Windett <windettalex@gmail.com>
Date: Thu, 15 Dec 2016 14:01:02 +0000
Subject: [PATCH] adding primary font and updating css for radio component

---
 ui/src/components/radio/index.js  | 3 ++-
 ui/src/components/toggle/index.js | 5 +++--
 ui/src/shared/constants.js        | 1 +
 3 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/ui/src/components/radio/index.js b/ui/src/components/radio/index.js
index ce3b19e0..23926899 100644
--- a/ui/src/components/radio/index.js
+++ b/ui/src/components/radio/index.js
@@ -14,9 +14,10 @@ const {
 
 const {
   default: styled,
+  css
 } = Styled;
 
-const CustomInputCircle = `
+const CustomInputCircle = css`
   content: '';
   position: absolute;
   width: 8px;
diff --git a/ui/src/components/toggle/index.js b/ui/src/components/toggle/index.js
index 6a22d6a7..28f69630 100644
--- a/ui/src/components/toggle/index.js
+++ b/ui/src/components/toggle/index.js
@@ -6,7 +6,8 @@ const Styled = require('styled-components');
 
 const {
   boxes,
-  colors
+  colors,
+  typography
 } = constants;
 
 const {
@@ -47,7 +48,7 @@ const StyledToggleLabel = styled.div`
 
   &::before {
     content: "Off";
-    font-family: inherit;
+    font-family: ${typography.fontPrimary};
     font-size: inherit;
     font-weight: bold;
     position: absolute;
diff --git a/ui/src/shared/constants.js b/ui/src/shared/constants.js
index 6f6c1585..f8b854af 100644
--- a/ui/src/shared/constants.js
+++ b/ui/src/shared/constants.js
@@ -102,6 +102,7 @@ const colors = {
 };
 
 const typography = {
+  fontPrimary: 'sans serif',
   dtFontWeight: 'bold',
   abbrBorderColor: colors.grayLight,
   textMuted: colors.grayLight