summaryrefslogtreecommitdiff
path: root/static/assets/bulma/sass/utilities/mixins.sass
diff options
context:
space:
mode:
authornavanchauhan <navanchauhan@gmail.com>2023-01-21 16:52:10 -0700
committernavanchauhan <navanchauhan@gmail.com>2023-01-21 16:52:10 -0700
commiteff65de6860690861024996bde0abb41e1a6e2d9 (patch)
treec5ae1735628c30298c25b29d9d406117a0548cc7 /static/assets/bulma/sass/utilities/mixins.sass
parent9d8f369405802c249658aa247b1c617126ead2da (diff)
bundle bulma
Diffstat (limited to 'static/assets/bulma/sass/utilities/mixins.sass')
-rw-r--r--static/assets/bulma/sass/utilities/mixins.sass303
1 files changed, 303 insertions, 0 deletions
diff --git a/static/assets/bulma/sass/utilities/mixins.sass b/static/assets/bulma/sass/utilities/mixins.sass
new file mode 100644
index 0000000..10cbae3
--- /dev/null
+++ b/static/assets/bulma/sass/utilities/mixins.sass
@@ -0,0 +1,303 @@
+@import "derived-variables"
+
+=clearfix
+ &::after
+ clear: both
+ content: " "
+ display: table
+
+=center($width, $height: 0)
+ position: absolute
+ @if $height != 0
+ left: calc(50% - (#{$width} * 0.5))
+ top: calc(50% - (#{$height} * 0.5))
+ @else
+ left: calc(50% - (#{$width} * 0.5))
+ top: calc(50% - (#{$width} * 0.5))
+
+=fa($size, $dimensions)
+ display: inline-block
+ font-size: $size
+ height: $dimensions
+ line-height: $dimensions
+ text-align: center
+ vertical-align: top
+ width: $dimensions
+
+=hamburger($dimensions)
+ -moz-appearance: none
+ -webkit-appearance: none
+ appearance: none
+ background: none
+ border: none
+ cursor: pointer
+ display: block
+ height: $dimensions
+ position: relative
+ width: $dimensions
+ span
+ background-color: currentColor
+ display: block
+ height: 1px
+ left: calc(50% - 8px)
+ position: absolute
+ transform-origin: center
+ transition-duration: $speed
+ transition-property: background-color, opacity, transform
+ transition-timing-function: $easing
+ width: 16px
+ &:nth-child(1)
+ top: calc(50% - 6px)
+ &:nth-child(2)
+ top: calc(50% - 1px)
+ &:nth-child(3)
+ top: calc(50% + 4px)
+ &:hover
+ background-color: bulmaRgba(black, 0.05)
+ // Modifers
+ &.is-active
+ span
+ &:nth-child(1)
+ transform: translateY(5px) rotate(45deg)
+ &:nth-child(2)
+ opacity: 0
+ &:nth-child(3)
+ transform: translateY(-5px) rotate(-45deg)
+
+=overflow-touch
+ -webkit-overflow-scrolling: touch
+
+=placeholder
+ $placeholders: ':-moz' ':-webkit-input' '-moz' '-ms-input'
+ @each $placeholder in $placeholders
+ &:#{$placeholder}-placeholder
+ @content
+
+=reset
+ -moz-appearance: none
+ -webkit-appearance: none
+ appearance: none
+ background: none
+ border: none
+ color: currentColor
+ font-family: inherit
+ font-size: 1em
+ margin: 0
+ padding: 0
+
+// Responsiveness
+
+=from($device)
+ @media screen and (min-width: $device)
+ @content
+
+=until($device)
+ @media screen and (max-width: $device - 1px)
+ @content
+
+=between($from, $until)
+ @media screen and (min-width: $from) and (max-width: $until - 1px)
+ @content
+
+=mobile
+ @media screen and (max-width: $tablet - 1px)
+ @content
+
+=tablet
+ @media screen and (min-width: $tablet), print
+ @content
+
+=tablet-only
+ @media screen and (min-width: $tablet) and (max-width: $desktop - 1px)
+ @content
+
+=touch
+ @media screen and (max-width: $desktop - 1px)
+ @content
+
+=desktop
+ @media screen and (min-width: $desktop)
+ @content
+
+=desktop-only
+ @if $widescreen-enabled
+ @media screen and (min-width: $desktop) and (max-width: $widescreen - 1px)
+ @content
+
+=until-widescreen
+ @if $widescreen-enabled
+ @media screen and (max-width: $widescreen - 1px)
+ @content
+
+=widescreen
+ @if $widescreen-enabled
+ @media screen and (min-width: $widescreen)
+ @content
+
+=widescreen-only
+ @if $widescreen-enabled and $fullhd-enabled
+ @media screen and (min-width: $widescreen) and (max-width: $fullhd - 1px)
+ @content
+
+=until-fullhd
+ @if $fullhd-enabled
+ @media screen and (max-width: $fullhd - 1px)
+ @content
+
+=fullhd
+ @if $fullhd-enabled
+ @media screen and (min-width: $fullhd)
+ @content
+
+=breakpoint($name)
+ $breakpoint: map-get($breakpoints, $name)
+ @if $breakpoint
+ $from: map-get($breakpoint, "from")
+ $until: map-get($breakpoint, "until")
+ @if $from and $until
+ +between($from, $until)
+ @content
+ @else if $from
+ +from($from)
+ @content
+ @else if $until
+ +until($until)
+ @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
+ -webkit-touch-callout: none
+ -webkit-user-select: none
+ -moz-user-select: none
+ -ms-user-select: none
+ user-select: none
+
+=arrow($color: transparent)
+ border: 3px solid $color
+ border-radius: 2px
+ border-right: 0
+ border-top: 0
+ content: " "
+ display: block
+ height: 0.625em
+ margin-top: -0.4375em
+ pointer-events: none
+ position: absolute
+ top: 50%
+ transform: rotate(-45deg)
+ transform-origin: center
+ width: 0.625em
+
+=block($spacing: $block-spacing)
+ &:not(:last-child)
+ margin-bottom: $spacing
+
+=delete
+ +unselectable
+ -moz-appearance: none
+ -webkit-appearance: none
+ 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
+ font-size: 0
+ height: 20px
+ max-height: 20px
+ max-width: 20px
+ min-height: 20px
+ min-width: 20px
+ outline: none
+ position: relative
+ vertical-align: top
+ width: 20px
+ &::before,
+ &::after
+ background-color: $scheme-main
+ content: ""
+ display: block
+ left: 50%
+ position: absolute
+ top: 50%
+ transform: translateX(-50%) translateY(-50%) rotate(45deg)
+ transform-origin: center center
+ &::before
+ height: 2px
+ width: 50%
+ &::after
+ height: 50%
+ width: 2px
+ &:hover,
+ &:focus
+ background-color: bulmaRgba($scheme-invert, 0.3)
+ &:active
+ background-color: bulmaRgba($scheme-invert, 0.4)
+ // Sizes
+ &.is-small
+ height: 16px
+ max-height: 16px
+ max-width: 16px
+ min-height: 16px
+ min-width: 16px
+ width: 16px
+ &.is-medium
+ height: 24px
+ max-height: 24px
+ max-width: 24px
+ min-height: 24px
+ min-width: 24px
+ width: 24px
+ &.is-large
+ height: 32px
+ max-height: 32px
+ max-width: 32px
+ min-height: 32px
+ min-width: 32px
+ width: 32px
+
+=loader
+ animation: spinAround 500ms infinite linear
+ border: 2px solid $grey-lighter
+ border-radius: $radius-rounded
+ border-right-color: transparent
+ border-top-color: transparent
+ content: ""
+ display: block
+ height: 1em
+ position: relative
+ width: 1em
+
+=overlay($offset: 0)
+ bottom: $offset
+ left: $offset
+ position: absolute
+ right: $offset
+ top: $offset