Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-21 12:44:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

Replace bulmaDarken and bulmaLighten instances

Browse Source
This commit is contained in:
Jeremy Thomas
2020-09-06 14:25:06 +01:00
parent 3ee48f2236
commit ed23e59334
11 changed files with 95 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
sass/form/file.sass
View File

@@ -1,12 +1,12 @@
$file-border-color: var(--border, #{$border}) !default
$file-radius: var(--radius, #{$radius}) !default
$file-cta-background-color: var(--scheme-main-ter, #{$scheme-main-ter}) !default
$file-cta-background-color: $scheme-main-ter !default
$file-cta-color: var(--text, #{$text}) !default
$file-cta-hover-color: var(--text-strong, #{$text-strong}) !default
$file-cta-active-color: var(--text-strong, #{$text-strong}) !default
$file-name-border-color: var(--border, #{$border}) !default
$file-name-border-color: $border !default
$file-name-border-style: solid !default
$file-name-border-width: 1px 1px 1px 0 !default
$file-name-max-width: 16em !default
@@ -35,6 +35,14 @@ $file-colors: $form-colors !default
$color: nth($pair, 1)
$color-invert: nth($pair, 2)
&.is-#{$name}
--hover-background-l-delta: -2.5%
--hover-background-#{$name}-l: calc(#{var(--#{$name}-light-l)} + #{var(--hover-background-l-delta)})
--hover-background-color: hsla(var(--#{$name}-h), var(--#{$name}-s), var(--hover-background-#{$name}-l), var(--#{$name}-a))
--focus-box-shadow-color-hsla: hsla(var(--#{$name}-h), var(--#{$name}-s), var(--#{$name}-l), 0.25)
--focus-box-shadow-color: var(--focus-box-shadow-color-hsla, #{bulmaRgba($color, 0.25)})
--active-background-l-delta: -5%
--active-background-#{$name}-l: calc(#{var(--#{$name}-light-l)} + #{var(--active-background-l-delta)})
--active-background-color: hsla(var(--#{$name}-h), var(--#{$name}-s), var(--active-background-#{$name}-l), var(--#{$name}-a))
.file-cta
background-color: var(--#{$name} #{$color})
border-color: transparent
@@ -42,19 +50,19 @@ $file-colors: $form-colors !default
&:hover,
&.is-hovered
.file-cta
background-color: bulmaDarken($color, 2.5%)
background-color: var(--hover-background-color, #{bulmaDarken($color, 2.5%)})
border-color: transparent
color: var(--#{$name}-invert, #{$color-invert})
&:focus,
&.is-focused
.file-cta
border-color: transparent
box-shadow: 0 0 0.5em bulmaRgba($color, 0.25)
box-shadow: 0 0 0.5em var(--focus-box-shadow-color)
color: var(--#{$name}-invert, #{$color-invert})
&:active,
&.is-active
.file-cta
background-color: bulmaDarken($color, 5%)
background-color: var(--active-background-color, #{bulmaDarken($color, 5%)})
border-color: transparent
color: var(--#{$name}-invert, #{$color-invert})
// Sizes

4
sass/form/input-textarea.sass
View File

@@ -15,12 +15,14 @@ $textarea-colors: $form-colors !default
@each $name, $pair in $textarea-colors
$color: nth($pair, 1)
&.is-#{$name}
--focus-box-shadow-color-hsla: hsla(var(--#{$name}-h), var(--#{$name}-s), var(--#{$name}-l), 0.25)
--focus-box-shadow-color: var(--focus-box-shadow-color-hsla, #{bulmaRgba($color, 0.25)})
border-color: var(--#{$name}, #{$color})
&:focus,
&.is-focused,
&:active,
&.is-active
box-shadow: var(--input-focus-box-shadow-size, #{$input-focus-box-shadow-size}) bulmaRgba($color, 0.25)
box-shadow: var(--input-focus-box-shadow-size, #{$input-focus-box-shadow-size}) var(--focus-box-shadow-color)
// Sizes
&.is-small
+control-small

4
sass/form/shared.sass
View File

@@ -6,7 +6,7 @@ $input-border-color: var(--border, #{$border}) !default
$input-height: var(--control-height, #{$control-height}) !default
$input-shadow-color: rgba(var(--scheme-invert-rgb, #{bulmaToRGB($black)}), 0.05) !default
$input-shadow: inset 0 0.0625em 0.125em $input-shadow-color !default
$input-placeholder-color: bulmaRgba($input-color, 0.3) !default
$input-placeholder-color: bulmaRgba($text-strong, 0.3) !default
$input-hover-color: var(--text-strong, #{$text-strong}) !default
$input-hover-border-color: var(--border-hover, #{$border-hover}) !default
@@ -19,7 +19,7 @@ $input-focus-box-shadow-color: bulmaRgba($link, 0.25) !default
$input-disabled-color: var(--text-light, #{$text-light}) !default
$input-disabled-background-color: var(--background, #{$background}) !default
$input-disabled-border-color: var(--background, #{$background}) !default
$input-disabled-placeholder-color: bulmaRgba($input-disabled-color, 0.3) !default
$input-disabled-placeholder-color: bulmaRgba($text-light, 0.3) !default
$input-arrow: var(--link, #{$link}) !default