Mercurial > nebulaweb3
diff default/assets/scss/vendors/bourbon/library/_contrast-switch.scss @ 0:1d038bc9b3d2 default tip
Up:default
author | Liny <dev@neowd.com> |
---|---|
date | Sat, 31 May 2025 09:21:51 +0800 |
parents | |
children |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/default/assets/scss/vendors/bourbon/library/_contrast-switch.scss Sat May 31 09:21:51 2025 +0800 @@ -0,0 +1,62 @@ +@charset "UTF-8"; + +/// Switches between two colors based on the lightness of a another color. Great +/// for building button styles. +/// +/// @argument {color} $base-color +/// The color to evaluate lightness against. +/// +/// @argument {color} $dark-color [#000] +/// The color to be output when `$base-color` is light. +/// +/// @argument {color} $light-color [#fff] +/// The color to be output when `$base-color` is dark. +/// +/// @return {color} +/// +/// @example scss +/// .element { +/// color: contrast-switch(#bae6e6); +/// } +/// +/// // CSS Output +/// .element { +/// color: #000; +/// } +/// +/// @example scss +/// .element { +/// $button-color: #2d72d9; +/// background-color: $button-color; +/// color: contrast-switch($button-color, #222, #eee); +/// } +/// +/// // CSS Output +/// .element { +/// background-color: #2d72d9; +/// color: #eee; +/// } +/// +/// @require {function} _is-light +/// +/// @since 5.0.0 + +@function contrast-switch( + $base-color, + $dark-color: _retrieve-bourbon-setting("contrast-switch-dark-color"), + $light-color: _retrieve-bourbon-setting("contrast-switch-light-color") + ) { + + @if not _is-color($base-color) { + @error "`#{$base-color}` is not a valid color for the `$base-color` " + + "argument in the `contrast-switch` function."; + } @else if not _is-color($dark-color) { + @error "`#{$dark-color}` is not a valid color for the `$dark-color` " + + "argument in the `contrast-switch` function."; + } @else if not _is-color($light-color) { + @error "`#{$light-color}` is not a valid color for the `$light-color` " + + "argument in the `contrast-switch` function."; + } @else { + @return if(_is-light($base-color), $dark-color, $light-color); + } +}