feat(slider): make discrete track ticks themable

Closes #621.
angular · Jan 6, 2015 · 91bc598 · 91bc598
1 parent 9a12239
commit 91bc598
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 1 deletion.
diff --git a/src/components/slider/slider-theme.scss b/src/components/slider/slider-theme.scss
@@ -3,6 +3,9 @@ md-slider.md-THEME_NAME-theme {
   .md-track {
     background-color: '{{foreground-3}}';
   }
+  .md-track-ticks {
+    background-color: '{{foreground-4}}';
+  }
   .md-focus-thumb {
     background-color: '{{foreground-2}}';
   }

diff --git a/src/components/slider/slider.js b/src/components/slider/slider.js
@@ -185,9 +185,10 @@ function SliderController($scope, $element, $attrs, $$rAF, $window, $mdAria, $md
 
       var numSteps = Math.floor( (max - min) / step );
       if (!tickCanvas) {
+        var trackTicksStyle = $window.getComputedStyle(tickContainer[0]);
         tickCanvas = angular.element('<canvas style="position:absolute;">');
         tickCtx = tickCanvas[0].getContext('2d');
-        tickCtx.fillStyle = 'black';
+        tickCtx.fillStyle = trackTicksStyle.backgroundColor || 'black';
         tickContainer.append(tickCanvas);
       }
       var dimensions = getSliderDimensions();