index.scss 995 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. .nut-indicator {
  2. &--block {
  3. display: block;
  4. width: 100%;
  5. }
  6. &--align__left {
  7. text-align: left;
  8. }
  9. &--align__right {
  10. text-align: right;
  11. }
  12. &--align__center {
  13. text-align: center;
  14. }
  15. &--dot,
  16. &--number {
  17. margin: 0 4px;
  18. &:first-child {
  19. margin-left: 0;
  20. }
  21. &:last-child {
  22. margin-right: 0;
  23. }
  24. }
  25. &--dot {
  26. display: inline-block;
  27. vertical-align: middle;
  28. width: $indicator-dot-size;
  29. height: $indicator-dot-size;
  30. border-radius: 50%;
  31. background-color: $indicator-dot-color;
  32. }
  33. &--number {
  34. display: inline-block;
  35. position: relative;
  36. width: $indicator-size;
  37. height: $indicator-size;
  38. text-align: center;
  39. font-size: $indicator-number-font-size;
  40. line-height: $indicator-size;
  41. color: $indicator-white;
  42. vertical-align: middle;
  43. border: 1px solid $indicator-white;
  44. border-radius: 50%;
  45. background-color: $indicator-color;
  46. box-shadow: 0 0 1px 1px $indicator-color;
  47. }
  48. }