_level-bars.scss 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. /*************
  2. * Level Bar *
  3. *************/
  4. levelbar {
  5. block {
  6. min-width: 32px;
  7. min-height: 6px;
  8. }
  9. &.vertical block {
  10. min-width: 6px;
  11. min-height: 32px;
  12. }
  13. &:backdrop { transition: $backdrop_transition; }
  14. trough {
  15. padding: 3px;
  16. border-radius: 3px;
  17. background-color: if($variant == 'light' ,transparentize(white,0.2),transparentize(black,0.86));
  18. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.1);
  19. &:backdrop {
  20. background-color: if($variant == 'light' ,transparentize(white,0.4),transparentize(black,0.94));
  21. box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.1);
  22. }
  23. }
  24. &.horizontal.discrete block { margin: 0 1px; }
  25. &.vertical.discrete block { margin: 1px 0; }
  26. block {
  27. border-radius: 2px;
  28. &:backdrop { box-shadow: none; }
  29. &.low {
  30. background-color: $warning_color;
  31. &:backdrop { border-color: $warning_color; };
  32. }
  33. &.high,
  34. &:not(.empty) {
  35. background-color: $cyan;
  36. &:backdrop { border-color: $cyan; }
  37. }
  38. &.full {
  39. background-color: $success_color;
  40. &:backdrop { border-color: $success_color; };
  41. }
  42. &.empty {
  43. background-color: transparentize(black,0.86);
  44. box-shadow: none;
  45. }
  46. }
  47. }