Advertisement
Guest User

Untitled

a guest
Jul 26th, 2017
76
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.01 KB | None | 0 0
  1. <md-switch ng-model="status" aria-label="Status" ng-class="{'md-primary': status === true, 'md-warn': status === false}"></md-switch>
  2.  
  3. /*
  4. * The bar:
  5. */
  6.  
  7. md-switch .md-bar {
  8. background-color: #333; /* set not selected bar color */
  9. }
  10.  
  11. md-switch.md-checked .md-bar {
  12. background-color: pink; /* set selected bar color */
  13. }
  14.  
  15. md-switch[disabled] .md-bar {
  16. background-color: rgba(51, 51, 51, .15); /* set disabled bar color */
  17. }
  18.  
  19. /*
  20. * The switch:
  21. */
  22.  
  23. md-switch .md-thumb {
  24. color: rgb(158,158,158); /* not selected switch color */
  25. }
  26.  
  27. md-switch.md-checked .md-thumb {
  28. background-color: rgb(255,255,255); /* selected switch color */
  29. }
  30.  
  31. md-switch[disabled] .md-thumb {
  32. background-color: rgb(255,255,255); /* disabled switch color */
  33. }
  34.  
  35. /*
  36. * Ripple effect
  37. */
  38.  
  39. md-switch .md-ink-ripple {
  40. color: rgb(255,0,0); /* not selected switch ripple color */
  41. }
  42. md-switch.md-checked .md-ink-ripple {
  43. color: rgb(92,184,92); /* selected switch ripple color */
  44. }
  45.  
  46. md-switch[disabled].my-custom-theme .md-bar {...}
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement