library-mirrors/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma.git synced 2025-01-09 15:44:25 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Derive ‘-invert’ sass variables from primary colors (#2594)

Browse Source
This commit is contained in:
Wessel Kuipers 2019-10-13 11:10:26 +02:00 committed by Jeremy Thomas
parent f6ed0ae356
commit f99771e6fe
3 changed files with 17 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@ -7,6 +7,7 @@
* Fix #2647 -> Missing meta tags in snippet * Fix #2647 -> Missing meta tags in snippet
* Fix #2031, Fix #2483 -> Invalid output when declaring a custom shade map * Fix #2031, Fix #2483 -> Invalid output when declaring a custom shade map
* Fix #2060 -> `height: auto` on HTML `audio` element breaks height of element * Fix #2060 -> `height: auto` on HTML `audio` element breaks height of element
* Fix #706 -> Derive `-invert` variables using `findColorInvert()`
* #1608 Fix #1552 -> `.container.is-fluid` margins * #1608 Fix #1552 -> `.container.is-fluid` margins
### New features ### New features

16
docs/_data/variables/utilities/derived-variables.json
View File

@ -107,49 +107,49 @@
}, },
"$primary-invert": { "$primary-invert": {
"name": "$primary-invert", "name": "$primary-invert",
"value": "$turquoise-invert", "value": "findColorInvert($primary)",
"type": "variable", "type": "variable",
"computed_type": "color", "computed_type": "color",
"computed_value": "#fff" "computed_value": "#fff"
}, },
"$info-invert": { "$info-invert": {
"name": "$info-invert", "name": "$info-invert",
"value": "$cyan-invert", "value": "findColorInvert($info)",
"type": "variable", "type": "variable",
"computed_type": "color", "computed_type": "color",
"computed_value": "#fff" "computed_value": "#fff"
}, },
"$success-invert": { "$success-invert": {
"name": "$success-invert", "name": "$success-invert",
"value": "$green-invert", "value": "findColorInvert($success)",
"type": "variable", "type": "variable",
"computed_type": "color", "computed_type": "color",
"computed_value": "#fff" "computed_value": "#fff"
}, },
"$warning-invert": { "$warning-invert": {
"name": "$warning-invert", "name": "$warning-invert",
"value": "$yellow-invert", "value": "findColorInvert($warning)",
"type": "variable", "type": "variable",
"computed_type": "color", "computed_type": "color",
"computed_value": "rgba(0, 0, 0, 0.7)" "computed_value": "rgba(0, 0, 0, 0.7)"
}, },
"$danger-invert": { "$danger-invert": {
"name": "$danger-invert", "name": "$danger-invert",
"value": "$red-invert", "value": "findColorInvert($danger)",
"type": "variable", "type": "variable",
"computed_type": "color", "computed_type": "color",
"computed_value": "#fff" "computed_value": "#fff"
}, },
"$light-invert": { "$light-invert": {
"name": "$light-invert", "name": "$light-invert",
"value": "$dark", "value": "findColorInvert($light)",
"type": "variable", "type": "variable",
"computed_type": "color", "computed_type": "color",
"computed_value": "hsl(0, 0%, 21%)" "computed_value": "hsl(0, 0%, 21%)"
}, },
"$dark-invert": { "$dark-invert": {
"name": "$dark-invert", "name": "$dark-invert",
"value": "$light", "value": "findColorInvert($dark)",
"type": "variable", "type": "variable",
"computed_type": "color", "computed_type": "color",
"computed_value": "hsl(0, 0%, 96%)" "computed_value": "hsl(0, 0%, 96%)"
@ -240,7 +240,7 @@
}, },
"$link-invert": { "$link-invert": {
"name": "$link-invert", "name": "$link-invert",
"value": "$blue-invert", "value": "findColorInvert($link)",
"type": "variable", "type": "variable",
"computed_type": "color", "computed_type": "color",
"computed_value": "#fff" "computed_value": "#fff"

16
sass/utilities/derived-variables.sass
View File

@ -19,13 +19,13 @@ $blue-invert: findColorInvert($blue) !default
$purple-invert: findColorInvert($purple) !default $purple-invert: findColorInvert($purple) !default
$red-invert: findColorInvert($red) !default $red-invert: findColorInvert($red) !default
$primary-invert: $turquoise-invert !default $primary-invert: findColorInvert($primary) !default
$info-invert: $cyan-invert !default $info-invert: findColorInvert($info) !default
$success-invert: $green-invert !default $success-invert: findColorInvert($success) !default
$warning-invert: $yellow-invert !default $warning-invert: findColorInvert($warning) !default
$danger-invert: $red-invert !default $danger-invert: findColorInvert($danger) !default
$light-invert: $dark !default $light-invert: findColorInvert($light) !default
$dark-invert: $light !default $dark-invert: findColorInvert($dark) !default
// General colors // General colors
@ -54,7 +54,7 @@ $pre-background: $background !default
// Link colors // Link colors
$link: $blue !default $link: $blue !default
$link-invert: $blue-invert !default $link-invert: findColorInvert($link) !default
$link-visited: $purple !default $link-visited: $purple !default
$link-hover: $grey-darker !default $link-hover: $grey-darker !default