Gauge.scss 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. $gauge-track-fill-opacity: dynamic(1);
  2. $gauge-track-stroke-opacity: dynamic(1);
  3. $gauge-track-stroke-width: dynamic(1);
  4. $gauge-value-fill-opacity: dynamic(1);
  5. $gauge-value-stroke: dynamic(none);
  6. $gauge-value-stroke-opacity: dynamic(1);
  7. $gauge-value-stroke-width: dynamic(1);
  8. $gauge-needle-fill-opacity: dynamic(1);
  9. $gauge-needle-stroke: dynamic(none);
  10. $gauge-needle-stroke-opacity: dynamic(1);
  11. $gauge-needle-stroke-width: dynamic(1);
  12. @mixin gauge-ui(
  13. $ui: null,
  14. $track-fill: null,
  15. $track-fill-opacity: null,
  16. $track-stroke: null,
  17. $track-stroke-opacity: null,
  18. $track-stroke-width: null,
  19. $value-fill: null,
  20. $value-fill-opacity: null,
  21. $value-stroke: null,
  22. $value-stroke-opacity: null,
  23. $value-stroke-width: null,
  24. $needle-fill: null,
  25. $needle-fill-opacity: null,
  26. $needle-stroke: null,
  27. $needle-stroke-opacity: null,
  28. $needle-stroke-width: null
  29. ) {
  30. $ui-suffix: ui-suffix($ui);
  31. .#{$prefix}gauge#{$ui-suffix} {
  32. svg {
  33. display: block;
  34. }
  35. .#{$prefix}gauge-track {
  36. fill: $track-fill;
  37. fill-opacity: $track-fill-opacity;
  38. stroke: $track-stroke;
  39. stroke-opacity: $track-stroke-opacity;
  40. stroke-width: $track-stroke-width;
  41. }
  42. .#{$prefix}gauge-value {
  43. fill: $value-fill;
  44. fill-opacity: $value-fill-opacity;
  45. stroke: $value-stroke;
  46. stroke-opacity: $value-stroke-opacity;
  47. stroke-width: $value-stroke-width;
  48. }
  49. .#{$prefix}gauge-needle {
  50. fill: $needle-fill;
  51. fill-opacity: $needle-fill-opacity;
  52. stroke: $needle-stroke;
  53. stroke-opacity: $needle-stroke-opacity;
  54. stroke-width: $needle-stroke-width;
  55. }
  56. }
  57. }