_variables.scss 3.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. @use 'sass:math';
  2. @use 'sass:map';
  3. @use '../../styles/settings';
  4. @use '../../styles/tools';
  5. // Defaults
  6. // if false, disabled buttons will be greyed out
  7. $button-colored-disabled: true !default;
  8. $button-background: rgb(var(--v-theme-surface)) !default;
  9. $button-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
  10. $button-banner-actions-padding: 0 8px !default; // @deprecated
  11. $button-pagination-active-overlay-opacity: var(--v-border-opacity) !default;
  12. $button-pagination-border-radius: settings.$border-radius-root !default;
  13. $button-pagination-rounded-border-radius: map.get(settings.$rounded, 'circle') !default;
  14. $button-border-color: settings.$border-color-root !default;
  15. $button-border-radius: settings.$border-radius-root !default;
  16. $button-border-style: settings.$border-style-root !default;
  17. $button-border-thin-width: thin !default;
  18. $button-border-width: 0 !default;
  19. $button-card-actions-padding: 0 8px !default; // @deprecated
  20. $button-content-transition: transform, opacity .2s settings.$standard-easing !default;
  21. $button-disabled-opacity: 0.26 !default;
  22. $button-disabled-overlay: 0.12 !default;
  23. $button-elevation: ('default': 2, 'hover': 4, 'active': 8) !default;
  24. $button-font-size: tools.map-deep-get(settings.$typography, 'button', 'size') !default;
  25. $button-font-weight: tools.map-deep-get(settings.$typography, 'button', 'weight') !default;
  26. $button-height: 36px !default;
  27. $button-stacked-height: 72px !default;
  28. $button-stacked-icon-margin: 4px !default;
  29. $button-icon-border-radius: map.get(settings.$rounded, 'circle') !default;
  30. $button-icon-font-size: 1rem !default;
  31. $button-line-height: normal !default;
  32. $button-loader-size: 1.5em !default;
  33. $button-stacked-line-height: 1.25 !default;
  34. $button-plain-opacity: .62 !default;
  35. $button-padding-ratio: 2.25 !default;
  36. $button-stacked-padding-ratio: 4.5 !default;
  37. $button-margin-start-multiplier: -9 !default;
  38. $button-margin-end-multiplier: 4.5 !default;
  39. $button-margin-start: calc(var(--v-btn-height) / #{$button-margin-start-multiplier}) !default;
  40. $button-margin-end: calc(var(--v-btn-height) / #{$button-margin-end-multiplier}) !default;
  41. $button-max-width: 100% !default;
  42. $button-positions: absolute fixed !default;
  43. $button-text-letter-spacing: tools.map-deep-get(settings.$typography, 'button', 'letter-spacing') !default;
  44. $button-text-transform: tools.map-deep-get(settings.$typography, 'button', 'text-transform') !default;
  45. $button-transition-property: box-shadow, transform, opacity, background !default;
  46. $button-vertical-align: middle !default;
  47. $button-width-ratio: math.div(16, 9) !default;
  48. $button-snackbar-action-padding: 0 8px !default; // @deprecated
  49. $button-slim-padding: 0 8px !default;
  50. $button-stacked-width-ratio: 1 !default;
  51. $button-rounded-border-radius: map.get(settings.$rounded, 'xl') !default;
  52. $button-white-space: nowrap !default;
  53. $button-density: ('default': 0, 'comfortable': -2, 'compact': -3) !default;
  54. $button-stacked-density: ('default': 0, 'comfortable': -4, 'compact': -6) !default;
  55. $button-icon-density: ('default': 3, 'comfortable': 0, 'compact': -2) !default;
  56. $button-border: (
  57. $button-border-color,
  58. $button-border-style,
  59. $button-border-width,
  60. $button-border-thin-width
  61. ) !default;
  62. $button-sizes: () !default;
  63. $button-sizes: map.merge(
  64. (
  65. 'height': $button-height,
  66. 'font-size': $button-font-size,
  67. 'width-ratio': $button-width-ratio,
  68. 'padding-ratio': $button-padding-ratio
  69. ),
  70. $button-sizes
  71. );
  72. $button-stacked-sizes: () !default;
  73. $button-stacked-sizes: map.merge(
  74. (
  75. 'height': $button-stacked-height,
  76. 'font-size': $button-font-size,
  77. 'width-ratio': $button-stacked-width-ratio,
  78. 'padding-ratio': $button-stacked-padding-ratio
  79. ),
  80. $button-stacked-sizes
  81. );
  82. $button-variants: (
  83. $button-background,
  84. $button-color,
  85. map.get($button-elevation, 'default'),
  86. $button-plain-opacity,
  87. 'v-btn'
  88. ) !default;