summaryrefslogtreecommitdiff
path: root/static/assets/bulma/sass/form/file.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/form/file.sass
parent9d8f369405802c249658aa247b1c617126ead2da (diff)
bundle bulma
Diffstat (limited to 'static/assets/bulma/sass/form/file.sass')
-rw-r--r--static/assets/bulma/sass/form/file.sass184
1 files changed, 184 insertions, 0 deletions
diff --git a/static/assets/bulma/sass/form/file.sass b/static/assets/bulma/sass/form/file.sass
new file mode 100644
index 0000000..9b84c84
--- /dev/null
+++ b/static/assets/bulma/sass/form/file.sass
@@ -0,0 +1,184 @@
+$file-border-color: $border !default
+$file-radius: $radius !default
+
+$file-cta-background-color: $scheme-main-ter !default
+$file-cta-color: $text !default
+$file-cta-hover-color: $text-strong !default
+$file-cta-active-color: $text-strong !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
+
+$file-colors: $form-colors !default
+
+.file
+ @extend %unselectable
+ align-items: stretch
+ display: flex
+ justify-content: flex-start
+ position: relative
+ // Colors
+ @each $name, $pair in $file-colors
+ $color: nth($pair, 1)
+ $color-invert: nth($pair, 2)
+ &.is-#{$name}
+ .file-cta
+ background-color: $color
+ border-color: transparent
+ color: $color-invert
+ &:hover,
+ &.is-hovered
+ .file-cta
+ background-color: bulmaDarken($color, 2.5%)
+ border-color: transparent
+ color: $color-invert
+ &:focus,
+ &.is-focused
+ .file-cta
+ border-color: transparent
+ box-shadow: 0 0 0.5em bulmaRgba($color, 0.25)
+ color: $color-invert
+ &:active,
+ &.is-active
+ .file-cta
+ background-color: bulmaDarken($color, 5%)
+ border-color: transparent
+ color: $color-invert
+ // Sizes
+ &.is-small
+ font-size: $size-small
+ &.is-normal
+ font-size: $size-normal
+ &.is-medium
+ font-size: $size-medium
+ .file-icon
+ .fa
+ font-size: 21px
+ &.is-large
+ font-size: $size-large
+ .file-icon
+ .fa
+ font-size: 28px
+ // Modifiers
+ &.has-name
+ .file-cta
+ border-bottom-right-radius: 0
+ border-top-right-radius: 0
+ .file-name
+ border-bottom-left-radius: 0
+ border-top-left-radius: 0
+ &.is-empty
+ .file-cta
+ border-radius: $file-radius
+ .file-name
+ display: none
+ &.is-boxed
+ .file-label
+ flex-direction: column
+ .file-cta
+ flex-direction: column
+ height: auto
+ padding: 1em 3em
+ .file-name
+ border-width: 0 1px 1px
+ .file-icon
+ height: 1.5em
+ width: 1.5em
+ .fa
+ font-size: 21px
+ &.is-small
+ .file-icon .fa
+ font-size: 14px
+ &.is-medium
+ .file-icon .fa
+ font-size: 28px
+ &.is-large
+ .file-icon .fa
+ font-size: 35px
+ &.has-name
+ .file-cta
+ border-radius: $file-radius $file-radius 0 0
+ .file-name
+ border-radius: 0 0 $file-radius $file-radius
+ border-width: 0 1px 1px
+ &.is-centered
+ justify-content: center
+ &.is-fullwidth
+ .file-label
+ width: 100%
+ .file-name
+ flex-grow: 1
+ max-width: none
+ &.is-right
+ justify-content: flex-end
+ .file-cta
+ border-radius: 0 $file-radius $file-radius 0
+ .file-name
+ border-radius: $file-radius 0 0 $file-radius
+ border-width: 1px 0 1px 1px
+ order: -1
+
+.file-label
+ align-items: stretch
+ display: flex
+ cursor: pointer
+ justify-content: flex-start
+ overflow: hidden
+ position: relative
+ &:hover
+ .file-cta
+ background-color: bulmaDarken($file-cta-background-color, 2.5%)
+ color: $file-cta-hover-color
+ .file-name
+ border-color: bulmaDarken($file-name-border-color, 2.5%)
+ &:active
+ .file-cta
+ background-color: bulmaDarken($file-cta-background-color, 5%)
+ color: $file-cta-active-color
+ .file-name
+ border-color: bulmaDarken($file-name-border-color, 5%)
+
+.file-input
+ height: 100%
+ left: 0
+ opacity: 0
+ outline: none
+ position: absolute
+ top: 0
+ width: 100%
+
+.file-cta,
+.file-name
+ @extend %control
+ border-color: $file-border-color
+ border-radius: $file-radius
+ font-size: 1em
+ padding-left: 1em
+ padding-right: 1em
+ white-space: nowrap
+
+.file-cta
+ background-color: $file-cta-background-color
+ color: $file-cta-color
+
+.file-name
+ border-color: $file-name-border-color
+ border-style: $file-name-border-style
+ border-width: $file-name-border-width
+ display: block
+ max-width: $file-name-max-width
+ overflow: hidden
+ text-align: inherit
+ text-overflow: ellipsis
+
+.file-icon
+ align-items: center
+ display: flex
+ height: 1em
+ justify-content: center
+ +ltr-property("margin", 0.5em)
+ width: 1em
+ .fa
+ font-size: 14px