LT-281: Replacing variables for theme calls

Packages/viewerbase/client/components/viewer/viewerMain/viewerMain.styl

@@ -11,8 +11,8 @@
 
     #imageViewerViewports
       .viewportContainer
+        theme('border', '%s solid $uiBorderColorDark' % $viewportBorderThickness)
         float: left
-        border: $viewportBorderThickness solid $viewportBorderColor
 
         outline: 0 // Prevent blue outline in Chrome
 
@@ -22,12 +22,12 @@
           outline: 0 // Prevent blue outline in Chrome
 
         &:hover
-          border: $viewportBorderThickness solid $viewportBorderColorHover
-          
+          theme('border', '%s solid $uiBorderColor' % $viewportBorderThickness)
+
         &.active, &:hover.active
-          border: $viewportBorderThickness solid $viewportBorderColorActive
+          theme('border', '%s solid $uiBorderColorActive' % $viewportBorderThickness)
 
         .removable
           width: 100%
           height: 100%
-          position: relative // Necessary so that the viewportOverlay is on top of the viewports
+          position: relative // Necessary so that the viewportOverlay is on top of the viewports