diff options
Diffstat (limited to 'assets/vendor/bulma/sass/utilities')
| -rw-r--r-- | assets/vendor/bulma/sass/utilities/_all.sass | 2 | ||||
| -rw-r--r-- | assets/vendor/bulma/sass/utilities/controls.sass | 20 | ||||
| -rw-r--r-- | assets/vendor/bulma/sass/utilities/derived-variables.sass | 84 | ||||
| -rw-r--r-- | assets/vendor/bulma/sass/utilities/derived-variables.scss | 132 | ||||
| -rw-r--r-- | assets/vendor/bulma/sass/utilities/functions.sass | 83 | ||||
| -rw-r--r-- | assets/vendor/bulma/sass/utilities/initial-variables.sass | 14 | ||||
| -rw-r--r-- | assets/vendor/bulma/sass/utilities/mixins.sass | 103 |
7 files changed, 289 insertions, 149 deletions
diff --git a/assets/vendor/bulma/sass/utilities/_all.sass b/assets/vendor/bulma/sass/utilities/_all.sass index bf4ecfe..b471577 100644 --- a/assets/vendor/bulma/sass/utilities/_all.sass +++ b/assets/vendor/bulma/sass/utilities/_all.sass @@ -2,7 +2,7 @@ @import "initial-variables.sass" @import "functions.sass" -@import "derived-variables.sass" +@import "derived-variables.scss" @import "animations.sass" @import "mixins.sass" @import "controls.sass" diff --git a/assets/vendor/bulma/sass/utilities/controls.sass b/assets/vendor/bulma/sass/utilities/controls.sass index 8dc3a61..cc7672a 100644 --- a/assets/vendor/bulma/sass/utilities/controls.sass +++ b/assets/vendor/bulma/sass/utilities/controls.sass @@ -3,10 +3,13 @@ $control-radius-small: $radius-small !default $control-border-width: 1px !default -$control-padding-vertical: calc(0.375em - #{$control-border-width}) !default -$control-padding-horizontal: calc(0.625em - #{$control-border-width}) !default +$control-height: 2.5em !default +$control-line-height: 1.5 !default -%control +$control-padding-vertical: calc(0.5em - #{$control-border-width}) !default +$control-padding-horizontal: calc(0.75em - #{$control-border-width}) !default + +=control -moz-appearance: none -webkit-appearance: none align-items: center @@ -15,9 +18,9 @@ $control-padding-horizontal: calc(0.625em - #{$control-border-width}) !default box-shadow: none display: inline-flex font-size: $size-normal - height: 2.25em + height: $control-height justify-content: flex-start - line-height: 1.5 + line-height: $control-line-height padding-bottom: $control-padding-vertical padding-left: $control-padding-horizontal padding-right: $control-padding-horizontal @@ -30,11 +33,12 @@ $control-padding-horizontal: calc(0.625em - #{$control-border-width}) !default &:active, &.is-active outline: none - &[disabled] + &[disabled], + fieldset[disabled] & cursor: not-allowed -=control - @extend %control +%control + +control // The controls sizes use mixins so they can be used at different breakpoints =control-small diff --git a/assets/vendor/bulma/sass/utilities/derived-variables.sass b/assets/vendor/bulma/sass/utilities/derived-variables.sass deleted file mode 100644 index aa91281..0000000 --- a/assets/vendor/bulma/sass/utilities/derived-variables.sass +++ /dev/null @@ -1,84 +0,0 @@ -$primary: $turquoise !default - -$info: $cyan !default -$success: $green !default -$warning: $yellow !default -$danger: $red !default - -$light: $white-ter !default -$dark: $grey-darker !default - -// Invert colors - -$orange-invert: findColorInvert($orange) !default -$yellow-invert: findColorInvert($yellow) !default -$green-invert: findColorInvert($green) !default -$turquoise-invert: findColorInvert($turquoise) !default -$cyan-invert: findColorInvert($cyan) !default -$blue-invert: findColorInvert($blue) !default -$purple-invert: findColorInvert($purple) !default -$red-invert: findColorInvert($red) !default - -$primary-invert: $turquoise-invert !default -$info-invert: $cyan-invert !default -$success-invert: $green-invert !default -$warning-invert: $yellow-invert !default -$danger-invert: $red-invert !default -$light-invert: $dark !default -$dark-invert: $light !default - -// General colors - -$background: $white-ter !default - -$border: $grey-lighter !default -$border-hover: $grey-light !default - -// Text colors - -$text: $grey-dark !default -$text-invert: findColorInvert($text) !default -$text-light: $grey !default -$text-strong: $grey-darker !default - -// Code colors - -$code: $red !default -$code-background: $background !default - -$pre: $text !default -$pre-background: $background !default - -// Link colors - -$link: $blue !default -$link-invert: $blue-invert !default -$link-visited: $purple !default - -$link-hover: $grey-darker !default -$link-hover-border: $grey-light !default - -$link-focus: $grey-darker !default -$link-focus-border: $blue !default - -$link-active: $grey-darker !default -$link-active-border: $grey-dark !default - -// Typography - -$family-primary: $family-sans-serif !default -$family-code: $family-monospace !default - -$size-small: $size-7 !default -$size-normal: $size-6 !default -$size-medium: $size-5 !default -$size-large: $size-4 !default - -// Lists and maps -$custom-colors: null !default -$custom-shades: null !default - -$colors: mergeColorMaps(("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert), "link": ($link, $link-invert), "info": ($info, $info-invert), "success": ($success, $success-invert), "warning": ($warning, $warning-invert), "danger": ($danger, $danger-invert)), $custom-colors) !default -$shades: mergeColorMaps(("black-bis": $black-bis, "black-ter": $black-ter, "grey-darker": $grey-darker, "grey-dark": $grey-dark, "grey": $grey, "grey-light": $grey-light, "grey-lighter": $grey-lighter, "white-ter": $white-ter, "white-bis": $white-bis), $custom-shades) !default - -$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default diff --git a/assets/vendor/bulma/sass/utilities/derived-variables.scss b/assets/vendor/bulma/sass/utilities/derived-variables.scss new file mode 100644 index 0000000..54a0358 --- /dev/null +++ b/assets/vendor/bulma/sass/utilities/derived-variables.scss @@ -0,0 +1,132 @@ +$primary: $turquoise !default; + +$info : $cyan !default; +$success: $green !default; +$warning: $yellow !default; +$danger : $red !default; + +$light : $white-ter !default; +$dark : $grey-darker !default; + +// Invert colors + +$orange-invert : findColorInvert($orange) !default; +$yellow-invert : findColorInvert($yellow) !default; +$green-invert : findColorInvert($green) !default; +$turquoise-invert: findColorInvert($turquoise) !default; +$cyan-invert : findColorInvert($cyan) !default; +$blue-invert : findColorInvert($blue) !default; +$purple-invert : findColorInvert($purple) !default; +$red-invert : findColorInvert($red) !default; + +$primary-invert : findColorInvert($primary) !default; +$primary-light : findLightColor($primary) !default; +$primary-dark : findDarkColor($primary) !default; +$info-invert : findColorInvert($info) !default; +$info-light : findLightColor($info) !default; +$info-dark : findDarkColor($info) !default; +$success-invert : findColorInvert($success) !default; +$success-light : findLightColor($success) !default; +$success-dark : findDarkColor($success) !default; +$warning-invert : findColorInvert($warning) !default; +$warning-light : findLightColor($warning) !default; +$warning-dark : findDarkColor($warning) !default; +$danger-invert : findColorInvert($danger) !default; +$danger-light : findLightColor($danger) !default; +$danger-dark : findDarkColor($danger) !default; +$light-invert : findColorInvert($light) !default; +$dark-invert : findColorInvert($dark) !default; + +// General colors + +$scheme-main : $white !default; +$scheme-main-bis : $white-bis !default; +$scheme-main-ter : $white-ter !default; +$scheme-invert : $black !default; +$scheme-invert-bis : $black-bis !default; +$scheme-invert-ter : $black-ter !default; + +$background : $white-ter !default; + +$border : $grey-lighter !default; +$border-hover : $grey-light !default; +$border-light : $grey-lightest !default; +$border-light-hover: $grey-light !default; + +// Text colors + +$text : $grey-dark !default; +$text-invert: findColorInvert($text) !default; +$text-light : $grey !default; +$text-strong: $grey-darker !default; + +// Code colors + +$code : $red !default; +$code-background: $background !default; + +$pre : $text !default; +$pre-background : $background !default; + +// Link colors + +$link : $blue !default; +$link-invert : findColorInvert($link) !default; +$link-light : findLightColor($link) !default; +$link-dark : findDarkColor($link) !default; +$link-visited : $purple !default; + +$link-hover : $grey-darker !default; +$link-hover-border : $grey-light !default; + +$link-focus : $grey-darker !default; +$link-focus-border : $blue !default; + +$link-active : $grey-darker !default; +$link-active-border: $grey-dark !default; + +// Typography + +$family-primary : $family-sans-serif !default; +$family-secondary: $family-sans-serif !default; +$family-code : $family-monospace !default; + +$size-small : $size-7 !default; +$size-normal: $size-6 !default; +$size-medium: $size-5 !default; +$size-large : $size-4 !default; + +// Lists and maps +$custom-colors: null !default; +$custom-shades: null !default; + +$colors: mergeColorMaps( +( + "white" : ($white, $black), + "black" : ($black, $white), + "light" : ($light, $light-invert), + "dark" : ($dark, $dark-invert), + "primary": ($primary, $primary-invert, $primary-light, $primary-dark), + "link" : ($link, $link-invert, $link-light, $link-dark), + "info" : ($info, $info-invert, $info-light, $info-dark), + "success": ($success, $success-invert, $success-light, $success-dark), + "warning": ($warning, $warning-invert, $warning-light, $warning-dark), + "danger" : ($danger, $danger-invert, $danger-light, $danger-dark)), + $custom-colors +) !default; + +$shades: mergeColorMaps( +( + "black-bis" : $black-bis, + "black-ter" : $black-ter, + "grey-darker" : $grey-darker, + "grey-dark" : $grey-dark, + "grey" : $grey, + "grey-light" : $grey-light, + "grey-lighter": $grey-lighter, + "white-ter" : $white-ter, + "white-bis" : $white-bis), + $custom-shades +) !default; + +$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default; diff --git a/assets/vendor/bulma/sass/utilities/functions.sass b/assets/vendor/bulma/sass/utilities/functions.sass index acd3e83..270121f 100644 --- a/assets/vendor/bulma/sass/utilities/functions.sass +++ b/assets/vendor/bulma/sass/utilities/functions.sass @@ -1,34 +1,53 @@ @function mergeColorMaps($bulma-colors, $custom-colors) - // we return at least bulma hardcoded colors + // We return at least Bulma's hard-coded colors $merged-colors: $bulma-colors - // we want a map as input + // We want a map as input @if type-of($custom-colors) == 'map' @each $name, $components in $custom-colors - // color name should be a string and colors pair a list with at least one element + // The color name should be a string + // and the components either a single color + // or a colors list with at least one element @if type-of($name) == 'string' and (type-of($components) == 'list' or type-of($components) == 'color') and length($components) >= 1 $color-base: null + $color-invert: null + $color-light: null + $color-dark: null + $value: null - // the param can either be a single color + // The param can either be a single color // or a list of 2 colors @if type-of($components) == 'color' $color-base: $components + $color-invert: findColorInvert($color-base) + $color-light: findLightColor($color-base) + $color-dark: findDarkColor($color-base) @else if type-of($components) == 'list' $color-base: nth($components, 1) + // If Invert, Light and Dark are provided + @if length($components) > 3 + $color-invert: nth($components, 2) + $color-light: nth($components, 3) + $color-dark: nth($components, 4) + // If only Invert and Light are provided + @else if length($components) > 2 + $color-invert: nth($components, 2) + $color-light: nth($components, 3) + $color-dark: findDarkColor($color-base) + // If only Invert is provided + @else + $color-invert: nth($components, 2) + $color-light: findLightColor($color-base) + $color-dark: findDarkColor($color-base) - $color-invert: null - // is an inverted color provided in the list - @if length($components) > 1 - $color-invert: nth($components, 2) + $value: ($color-base, $color-invert, $color-light, $color-dark) - // we only want a color as base color + // We only want to merge the map if the color base is an actual color @if type-of($color-base) == 'color' - // if inverted color is not provided or is not a color we compute it - @if type-of($color-invert) != 'color' - $color-invert: findColorInvert($color-base) - - // we merge this colors elements as map with bulma colors (we can override them this way, no multiple definition for the same name) - $merged-colors: map_merge($merged-colors, ($name: ($color-base, $color-invert))) + // We merge this colors elements as map with Bulma's colors map + // (we can override them this way, no multiple definition for the same name) + // $merged-colors: map_merge($merged-colors, ($name: ($color-base, $color-invert, $color-light, $color-dark))) + $merged-colors: map_merge($merged-colors, ($name: $value)) @return $merged-colors @@ -43,6 +62,8 @@ @return $value @function colorLuminance($color) + @if type-of($color) != 'color' + @return 0.55 $color-rgb: ('red': red($color),'green': green($color),'blue': blue($color)) @each $name, $value in $color-rgb $adjusted: 0 @@ -60,3 +81,35 @@ @return rgba(#000, 0.7) @else @return #fff + +@function findLightColor($color) + @if type-of($color) == 'color' + $l: 96% + @if lightness($color) > 96% + $l: lightness($color) + @return change-color($color, $lightness: $l) + @return $background + +@function findDarkColor($color) + @if type-of($color) == 'color' + $base-l: 29% + $luminance: colorLuminance($color) + $luminance-delta: (0.53 - $luminance) + $target-l: round($base-l + ($luminance-delta * 53)) + @return change-color($color, $lightness: max($base-l, $target-l)) + @return $text-strong + +@function bulmaRgba($color, $alpha) + @if type-of($color) != 'color' + @return $color + @return rgba($color, $alpha) + +@function bulmaDarken($color, $amount) + @if type-of($color) != 'color' + @return $color + @return darken($color, $amount) + +@function bulmaLighten($color, $amount) + @if type-of($color) != 'color' + @return $color + @return lighten($color, $amount) diff --git a/assets/vendor/bulma/sass/utilities/initial-variables.sass b/assets/vendor/bulma/sass/utilities/initial-variables.sass index 421bd3d..a1d688b 100644 --- a/assets/vendor/bulma/sass/utilities/initial-variables.sass +++ b/assets/vendor/bulma/sass/utilities/initial-variables.sass @@ -9,6 +9,7 @@ $grey-dark: hsl(0, 0%, 29%) !default $grey: hsl(0, 0%, 48%) !default $grey-light: hsl(0, 0%, 71%) !default $grey-lighter: hsl(0, 0%, 86%) !default +$grey-lightest: hsl(0, 0%, 93%) !default $white-ter: hsl(0, 0%, 96%) !default $white-bis: hsl(0, 0%, 98%) !default @@ -16,12 +17,12 @@ $white: hsl(0, 0%, 100%) !default $orange: hsl(14, 100%, 53%) !default $yellow: hsl(48, 100%, 67%) !default -$green: hsl(141, 71%, 48%) !default +$green: hsl(141, 53%, 53%) !default $turquoise: hsl(171, 100%, 41%) !default -$cyan: hsl(204, 86%, 53%) !default +$cyan: hsl(204, 71%, 53%) !default $blue: hsl(217, 71%, 53%) !default $purple: hsl(271, 100%, 71%) !default -$red: hsl(348, 100%, 61%) !default +$red: hsl(348, 86%, 61%) !default // Typography @@ -43,10 +44,14 @@ $weight-medium: 500 !default $weight-semibold: 600 !default $weight-bold: 700 !default +// Spacing + +$block-spacing: 1.5rem !default + // Responsiveness // The container horizontal gap, which acts as the offset for breakpoints -$gap: 64px !default +$gap: 32px !default // 960, 1152, and 1344 have been chosen because they are divisible by both 12 and 16 $tablet: 769px !default // 960px container + 4rem @@ -70,3 +75,4 @@ $speed: 86ms !default // Flags $variable-columns: true !default +$rtl: false !default diff --git a/assets/vendor/bulma/sass/utilities/mixins.sass b/assets/vendor/bulma/sass/utilities/mixins.sass index 097c2c1..293a060 100644 --- a/assets/vendor/bulma/sass/utilities/mixins.sass +++ b/assets/vendor/bulma/sass/utilities/mixins.sass @@ -48,7 +48,7 @@ &:nth-child(3) top: calc(50% + 4px) &:hover - background-color: rgba(black, 0.05) + background-color: bulmaRgba(black, 0.05) // Modifers &.is-active span @@ -128,20 +128,44 @@ @media screen and (min-width: $fullhd) @content +=ltr + @if not $rtl + @content + +=rtl + @if $rtl + @content + +=ltr-property($property, $spacing, $right: true) + $normal: if($right, "right", "left") + $opposite: if($right, "left", "right") + @if $rtl + #{$property}-#{$opposite}: $spacing + @else + #{$property}-#{$normal}: $spacing + +=ltr-position($spacing, $right: true) + $normal: if($right, "right", "left") + $opposite: if($right, "left", "right") + @if $rtl + #{$opposite}: $spacing + @else + #{$normal}: $spacing + // Placeholders -%unselectable +=unselectable -webkit-touch-callout: none -webkit-user-select: none -moz-user-select: none -ms-user-select: none user-select: none -=unselectable - @extend %unselectable +%unselectable + +unselectable -%arrow - border: 3px solid transparent +=arrow($color: transparent) + border: 3px solid $color border-radius: 2px border-right: 0 border-top: 0 @@ -156,25 +180,35 @@ transform-origin: center width: 0.625em -=arrow($color) - @extend %arrow - border-color: $color +%arrow + +arrow -%block +=block($spacing: $block-spacing) &:not(:last-child) - margin-bottom: 1.5rem + margin-bottom: $spacing -=block - @extend %block +%block + +block -%delete - @extend %unselectable +=delete + // Fix begins. Added to patch this error: + // "You may not @extend an outer selector from within @media. + // You may only @extend selectors within the same directive. + // From "@extend %unselectable" on line 194..." + //@extend %unselectable + -webkit-touch-callout: none + -webkit-user-select: none + -moz-user-select: none + -ms-user-select: none + user-select: none + // Fix ends -moz-appearance: none -webkit-appearance: none - background-color: rgba($black, 0.2) + background-color: bulmaRgba($scheme-invert, 0.2) border: none border-radius: $radius-rounded cursor: pointer + pointer-events: auto display: inline-block flex-grow: 0 flex-shrink: 0 @@ -190,7 +224,7 @@ width: 20px &::before, &::after - background-color: $white + background-color: $scheme-main content: "" display: block left: 50% @@ -206,9 +240,9 @@ width: 2px &:hover, &:focus - background-color: rgba($black, 0.3) + background-color: bulmaRgba($scheme-invert, 0.3) &:active - background-color: rgba($black, 0.4) + background-color: bulmaRgba($scheme-invert, 0.4) // Sizes &.is-small height: 16px @@ -232,12 +266,12 @@ min-width: 32px width: 32px -=delete - @extend %delete +%delete + +delete -%loader +=loader animation: spinAround 500ms infinite linear - border: 2px solid $border + border: 2px solid $grey-lighter border-radius: $radius-rounded border-right-color: transparent border-top-color: transparent @@ -247,20 +281,15 @@ position: relative width: 1em -=loader - @extend %loader +%loader + +loader -%overlay - bottom: 0 - left: 0 +=overlay($offset: 0) + bottom: $offset + left: $offset position: absolute - right: 0 - top: 0 + right: $offset + top: $offset -=overlay($offset: 0) - @extend %overlay - @if $offset != 0 - bottom: $offset - left: $offset - right: $offset - top: $offset +%overlay + +overlay |