96 lines
3.8 KiB
SCSS
96 lines
3.8 KiB
SCSS
|
@use 'sass:math';
|
||
|
|
@use 'sass:map';
|
||
|
|
@use '../../styles/settings';
|
||
|
|
@use '../../styles/tools';
|
||
|
|
|
||
|
|
// Defaults
|
||
|
|
// if false, disabled buttons will be greyed out
|
||
|
|
$button-colored-disabled: true !default;
|
||
|
|
|
||
|
|
$button-background: rgb(var(--v-theme-surface)) !default;
|
||
|
|
$button-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
|
||
|
|
$button-banner-actions-padding: 0 8px !default; // @deprecated
|
||
|
|
$button-pagination-active-overlay-opacity: var(--v-border-opacity) !default;
|
||
|
|
$button-pagination-border-radius: settings.$border-radius-root !default;
|
||
|
|
$button-pagination-rounded-border-radius: map.get(settings.$rounded, 'circle') !default;
|
||
|
|
$button-border-color: settings.$border-color-root !default;
|
||
|
|
$button-border-radius: settings.$border-radius-root !default;
|
||
|
|
$button-border-style: settings.$border-style-root !default;
|
||
|
|
$button-border-thin-width: thin !default;
|
||
|
|
$button-border-width: 0 !default;
|
||
|
|
$button-card-actions-margin: .5rem !default;
|
||
|
|
$button-card-actions-padding: 0 8px !default; // @deprecated
|
||
|
|
$button-content-transition: transform, opacity .2s settings.$standard-easing !default;
|
||
|
|
$button-disabled-opacity: 0.26 !default;
|
||
|
|
$button-disabled-overlay: 0.12 !default;
|
||
|
|
$button-elevation: ('default': 2, 'hover': 4, 'active': 8) !default;
|
||
|
|
$button-font-size: tools.map-deep-get(settings.$typography, 'button', 'size') !default;
|
||
|
|
$button-font-weight: tools.map-deep-get(settings.$typography, 'button', 'weight') !default;
|
||
|
|
$button-height: 36px !default;
|
||
|
|
$button-stacked-height: 72px !default;
|
||
|
|
$button-stacked-icon-margin: 4px !default;
|
||
|
|
$button-icon-border-radius: map.get(settings.$rounded, 'circle') !default;
|
||
|
|
$button-icon-font-size: 1rem !default;
|
||
|
|
$button-line-height: normal !default;
|
||
|
|
$button-stacked-line-height: 1.25 !default;
|
||
|
|
$button-plain-opacity: .62 !default;
|
||
|
|
$button-padding-ratio: 2.25 !default;
|
||
|
|
$button-stacked-padding-ratio: 4.5 !default;
|
||
|
|
$button-margin-start-multiplier: -9 !default;
|
||
|
|
$button-margin-end-multiplier: 4.5 !default;
|
||
|
|
$button-margin-start: calc(var(--v-btn-height) / #{$button-margin-start-multiplier}) !default;
|
||
|
|
$button-margin-end: calc(var(--v-btn-height) / #{$button-margin-end-multiplier}) !default;
|
||
|
|
$button-max-width: 100% !default;
|
||
|
|
$button-positions: absolute fixed !default;
|
||
|
|
$button-text-letter-spacing: tools.map-deep-get(settings.$typography, 'button', 'letter-spacing') !default;
|
||
|
|
$button-text-transform: tools.map-deep-get(settings.$typography, 'button', 'text-transform') !default;
|
||
|
|
$button-transition-property: box-shadow, transform, opacity, background !default;
|
||
|
|
$button-vertical-align: middle !default;
|
||
|
|
$button-width-ratio: math.div(16, 9) !default;
|
||
|
|
$button-snackbar-action-padding: 0 8px !default; // @deprecated
|
||
|
|
$button-slim-padding: 0 8px !default;
|
||
|
|
$button-stacked-width-ratio: 1 !default;
|
||
|
|
$button-rounded-border-radius: map.get(settings.$rounded, 'xl') !default;
|
||
|
|
$button-white-space: nowrap !default;
|
||
|
|
|
||
|
|
$button-density: ('default': 0, 'comfortable': -2, 'compact': -3) !default;
|
||
|
|
$button-stacked-density: ('default': 0, 'comfortable': -4, 'compact': -6) !default;
|
||
|
|
$button-icon-density: ('default': 3, 'comfortable': 0, 'compact': -2) !default;
|
||
|
|
|
||
|
|
$button-border: (
|
||
|
|
$button-border-color,
|
||
|
|
$button-border-style,
|
||
|
|
$button-border-width,
|
||
|
|
$button-border-thin-width
|
||
|
|
) !default;
|
||
|
|
|
||
|
|
$button-sizes: () !default;
|
||
|
|
$button-sizes: map.merge(
|
||
|
|
(
|
||
|
|
'height': $button-height,
|
||
|
|
'font-size': $button-font-size,
|
||
|
|
'width-ratio': $button-width-ratio,
|
||
|
|
'padding-ratio': $button-padding-ratio
|
||
|
|
),
|
||
|
|
$button-sizes
|
||
|
|
);
|
||
|
|
|
||
|
|
$button-stacked-sizes: () !default;
|
||
|
|
$button-stacked-sizes: map.merge(
|
||
|
|
(
|
||
|
|
'height': $button-stacked-height,
|
||
|
|
'font-size': $button-font-size,
|
||
|
|
'width-ratio': $button-stacked-width-ratio,
|
||
|
|
'padding-ratio': $button-stacked-padding-ratio
|
||
|
|
),
|
||
|
|
$button-stacked-sizes
|
||
|
|
);
|
||
|
|
|
||
|
|
$button-variants: (
|
||
|
|
$button-background,
|
||
|
|
$button-color,
|
||
|
|
map.get($button-elevation, 'default'),
|
||
|
|
$button-plain-opacity,
|
||
|
|
'v-btn'
|
||
|
|
) !default;
|