LT-281: Replacing variables for theme calls

Packages/design/styles/components/radio.styl

@@ -3,12 +3,12 @@
 .group-radio
   label
     cursor: pointer
-    
+
     input
       height: 0
       width: 0
       visibility: hidden
-      
+
     span
       padding-left: 23px
       position: relative
@@ -23,14 +23,14 @@
         top: 50%
         transform(translateY(-50%))
         width: 16px
-    
+
     input:focus + span:before
       // TODO: [design] define a outline for the design
+      theme('box-shadow', '0 0 2px 2px $textSecondaryColor')
       outline: none
-      box-shadow: 0 0 2px 2px $textSecondaryColor
-    
+
     input:checked + span:after
-      background: $uiBorderColorDark
+      theme('background', '$uiBorderColorDark')
       border-radius: 5px
       content: ''
       height: 10px

Packages/design/styles/components/select2.styl

@@ -22,8 +22,8 @@ span.select2.select2-container
     padding-left: 11px
 
   span.select2-selection__arrow
+    theme('border-left', '1px solid $primaryBackgroundColor')
     background-color: $gray1
-    border-left: 1px solid $primaryBackgroundColor
     border-top-right-radius: $borderRadius
     border-bottom-right-radius: $borderRadius
     right: 0
@@ -42,8 +42,8 @@ span.select2.select2-container
       placeholder-color($gray4)
 
     li.select2-selection__choice
+      theme('border-color', '$uiGray')
       background-color: #FFF
-      border-color: $uiGray
       border-radius: $borderRadius
       color: $gray4
       font-size: 12px