mirror of
https://github.com/tusen-ai/naive-ui.git
synced 2025-01-12 12:25:16 +08:00
204 lines
8.3 KiB
SCSS
204 lines
8.3 KiB
SCSS
@mixin setup-light-button {
|
|
$--button-box-shadow-ripple-spread: 4px;
|
|
$--button-ripple-box-shadow: (
|
|
'default-start': (0 0 0 0 $--n-primary-color),
|
|
'default-end': (0 0 0 $--button-box-shadow-ripple-spread $--n-primary-color),
|
|
'primary-start': (0 0 0 0 $--n-primary-color),
|
|
'primary-end': (0 0 0 $--button-box-shadow-ripple-spread $--n-primary-color),
|
|
'success-start': (0 0 0 0 $--n-success-color),
|
|
'success-end': (0 0 0 $--button-box-shadow-ripple-spread $--n-success-color),
|
|
'info-start': (0 0 0 0 $--n-info-color),
|
|
'info-end': (0 0 0 $--button-box-shadow-ripple-spread $--n-info-color),
|
|
'warning-start': (0 0 0 0 $--n-warning-color),
|
|
'warning-end': (0 0 0 $--button-box-shadow-ripple-spread $--n-warning-color),
|
|
'error-start': (0 0 0 0 $--n-error-color),
|
|
'error-end': (0 0 0 $--button-box-shadow-ripple-spread $--n-error-color)
|
|
) !global;
|
|
$--button-border-color: (
|
|
'default': $--n-border-color,
|
|
'primary': transparent,
|
|
'success': transparent,
|
|
'info': transparent,
|
|
'warning': transparent,
|
|
'error': transparent
|
|
) !global;
|
|
$--button-border-mask-box-shadow: (
|
|
'default-hover': inset 0 0 0 1px $--n-primary-hover-color,
|
|
'default-active': inset 0 0 0 1px $--n-primary-active-color,
|
|
'default-focus': (inset 0 0 0 1px $--n-primary-color),
|
|
'primary-hover': none,
|
|
'primary-active': none,
|
|
'primary-focus': none,
|
|
'success-hover': none,
|
|
'success-active': none,
|
|
'success-focus': none,
|
|
'info-hover': none,
|
|
'info-active': none,
|
|
'info-focus': none,
|
|
'warning-hover': none,
|
|
'warning-active': none,
|
|
'warning-focus': none,
|
|
'error-hover': none,
|
|
'error-active': none,
|
|
'error-focus': none
|
|
) !global;
|
|
$--button-ghost-typed-border-color: (
|
|
'default': $--n-border-color,
|
|
'primary': $--n-primary-color,
|
|
'success': $--n-success-color,
|
|
'info': $--n-info-color,
|
|
'warning': $--n-warning-color,
|
|
'error': $--n-error-color,
|
|
) !global;
|
|
$--button-ghost-typed-border-mask-box-shadow: (
|
|
'default-hover': (inset 0 0 0 1px $--n-primary-hover-color),
|
|
'default-active': (inset 0 0 0 1px $--n-primary-active-color),
|
|
'default-focus': (inset 0 0 0 1px $--n-primary-hover-color),
|
|
'primary-hover': inset 0 0 0 1px $--n-primary-hover-color,
|
|
'primary-active': inset 0 0 0 1px $--n-primary-active-color,
|
|
'primary-focus': inset 0 0 0 1px $--n-primary-hover-color,
|
|
'success-hover': inset 0 0 0 1px $--n-success-hover-color,
|
|
'success-active': inset 0 0 0 1px $--n-success-active-color,
|
|
'success-focus': inset 0 0 0 1px $--n-success-hover-color,
|
|
'info-hover': inset 0 0 0 1px $--n-info-hover-color,
|
|
'info-active': inset 0 0 0 1px $--n-info-active-color,
|
|
'info-focus': inset 0 0 0 1px $--n-info-hover-color,
|
|
'warning-hover': inset 0 0 0 1px $--n-warning-hover-color,
|
|
'warning-active': inset 0 0 0 1px $--n-warning-active-color,
|
|
'warning-focus': inset 0 0 0 1px $--n-warning-hover-color,
|
|
'error-hover': inset 0 0 0 1px $--n-error-hover-color,
|
|
'error-active': inset 0 0 0 1px $--n-error-active-color,
|
|
'error-focus': inset 0 0 0 1px $--n-error-hover-color
|
|
) !global;
|
|
$--button-background-color: (
|
|
'default': $--n-base-background-color,
|
|
'default-focus': $--n-base-background-color,
|
|
'default-hover': $--n-base-background-color,
|
|
'default-active': $--n-base-background-color,
|
|
'primary': $--n-primary-color,
|
|
'primary-focus': $--n-primary-hover-color,
|
|
'primary-hover': $--n-primary-hover-color,
|
|
'primary-active': $--n-primary-active-color,
|
|
'info': $--n-info-color,
|
|
'info-focus': $--n-info-hover-color,
|
|
'info-hover': $--n-info-hover-color,
|
|
'info-active': $--n-info-active-color,
|
|
'success': $--n-success-color,
|
|
'success-focus': $--n-success-hover-color,
|
|
'success-hover': $--n-success-hover-color,
|
|
'success-active': $--n-success-active-color,
|
|
'warning': $--n-warning-color,
|
|
'warning-focus': $--n-warning-hover-color,
|
|
'warning-hover': $--n-warning-hover-color,
|
|
'warning-active': $--n-warning-active-color,
|
|
'error': $--n-error-color,
|
|
'error-focus': $--n-error-hover-color,
|
|
'error-hover': $--n-error-hover-color,
|
|
'error-active': $--n-error-active-color,
|
|
) !global;
|
|
$--button-ghost-typed-background-color: (
|
|
'default': transparent,
|
|
'default-focus': transparent,
|
|
'default-hover': transparent,
|
|
'default-active': transparent,
|
|
'primary': transparent,
|
|
'primary-focus': transparent,
|
|
'primary-hover': transparent,
|
|
'primary-active': transparent,
|
|
'info': transparent,
|
|
'info-focus': transparent,
|
|
'info-hover': transparent,
|
|
'info-active': transparent,
|
|
'success': transparent,
|
|
'success-focus': transparent,
|
|
'success-hover': transparent,
|
|
'success-active': transparent,
|
|
'error': transparent,
|
|
'error-focus': transparent,
|
|
'error-hover': transparent,
|
|
'error-active': transparent,
|
|
'warning': transparent,
|
|
'warning-focus': transparent,
|
|
'warning-hover': transparent,
|
|
'warning-active': transparent
|
|
)!global;
|
|
$--button-ghost-typed-text-color: (
|
|
'default': $--n-secondary-text-color,
|
|
'default-focus': $--n-primary-hover-color,
|
|
'default-hover': $--n-primary-hover-color,
|
|
'default-active': $--n-primary-active-color,
|
|
'primary': $--n-primary-color,
|
|
'primary-focus': $--n-primary-hover-color,
|
|
'primary-hover': $--n-primary-hover-color,
|
|
'primary-active': $--n-primary-active-color,
|
|
'info': $--n-info-color,
|
|
'info-focus': $--n-info-hover-color,
|
|
'info-hover': $--n-info-hover-color,
|
|
'info-active': $--n-info-active-color,
|
|
'success': $--n-success-color,
|
|
'success-focus': $--n-success-hover-color,
|
|
'success-hover': $--n-success-hover-color,
|
|
'success-active': $--n-success-active-color,
|
|
'warning': $--n-warning-color,
|
|
'warning-focus': $--n-warning-hover-color,
|
|
'warning-hover': $--n-warning-hover-color,
|
|
'warning-active': $--n-warning-active-color,
|
|
'error': $--n-error-color,
|
|
'error-focus': $--n-error-hover-color,
|
|
'error-hover': $--n-error-hover-color,
|
|
'error-active': $--n-error-active-color,
|
|
) !global;
|
|
$--button-text-color: (
|
|
'default': $--n-secondary-text-color,
|
|
'default-focus': $--n-primary-hover-color,
|
|
'default-hover': $--n-primary-hover-color,
|
|
'default-active': $--n-primary-active-color,
|
|
'primary': $--n-base-background-color,
|
|
'primary-focus': $--n-base-background-color,
|
|
'primary-hover': $--n-base-background-color,
|
|
'primary-active': $--n-base-background-color,
|
|
'info': $--n-base-background-color,
|
|
'info-focus': $--n-base-background-color,
|
|
'info-hover': $--n-base-background-color,
|
|
'info-active': $--n-base-background-color,
|
|
'success': $--n-base-background-color,
|
|
'success-focus':$--n-base-background-color,
|
|
'success-hover': $--n-base-background-color,
|
|
'success-active': $--n-base-background-color,
|
|
'warning': $--n-base-background-color,
|
|
'warning-focus': $--n-base-background-color,
|
|
'warning-hover': $--n-base-background-color,
|
|
'warning-active': $--n-base-background-color,
|
|
'error': $--n-base-background-color,
|
|
'error-focus': $--n-base-background-color,
|
|
'error-hover': $--n-base-background-color,
|
|
'error-active': $--n-base-background-color
|
|
) !global;
|
|
$--button-text-typed-text-color: (
|
|
'default': $--n-secondary-text-color,
|
|
'default-hover': $--n-primary-hover-color,
|
|
'default-active': $--n-primary-active-color,
|
|
'default-focus': $--n-primary-hover-color,
|
|
'primary': $--n-primary-color,
|
|
'primary-hover': $--n-primary-hover-color,
|
|
'primary-active': $--n-primary-active-color,
|
|
'primary-focus': $--n-primary-hover-color,
|
|
'info': $--n-info-color,
|
|
'info-hover': $--n-info-hover-color,
|
|
'info-active': $--n-info-active-color,
|
|
'info-focus': $--n-info-hover-color,
|
|
'success': $--n-success-color,
|
|
'success-hover': $--n-success-hover-color,
|
|
'success-active': $--n-success-active-color,
|
|
'success-focus': $--n-success-hover-color,
|
|
'warning': $--n-warning-color,
|
|
'warning-hover': $--n-warning-hover-color,
|
|
'warning-active': $--n-warning-active-color,
|
|
'warning-focus': $--n-warning-hover-color,
|
|
'error': $--n-error-color,
|
|
'error-hover': $--n-error-hover-color,
|
|
'error-active': $--n-error-active-color,
|
|
'error-focus': $--n-error-hover-color,
|
|
) !global;
|
|
$--button-disabled-opacity: $--n-disabled-opacity !global;
|
|
} |