aboutsummaryrefslogtreecommitdiff
path: root/themes/hugo-pt2021/assets/bulma-0.9.3/sass/components/tabs.sass
diff options
context:
space:
mode:
authorPaul Duncan <pabs@pablotron.org>2021-10-14 12:47:50 -0400
committerPaul Duncan <pabs@pablotron.org>2021-10-14 12:47:50 -0400
commit4b6c0e31385f5f27a151088c0a2b614495c4e589 (patch)
tree12243cdcd00704bc1a9d94ac9cc128459417370c /themes/hugo-pt2021/assets/bulma-0.9.3/sass/components/tabs.sass
downloadpablotron.org-4b6c0e31385f5f27a151088c0a2b614495c4e589.tar.bz2
pablotron.org-4b6c0e31385f5f27a151088c0a2b614495c4e589.zip
initial commit, including theme
Diffstat (limited to 'themes/hugo-pt2021/assets/bulma-0.9.3/sass/components/tabs.sass')
-rw-r--r--themes/hugo-pt2021/assets/bulma-0.9.3/sass/components/tabs.sass176
1 files changed, 176 insertions, 0 deletions
diff --git a/themes/hugo-pt2021/assets/bulma-0.9.3/sass/components/tabs.sass b/themes/hugo-pt2021/assets/bulma-0.9.3/sass/components/tabs.sass
new file mode 100644
index 0000000..2cb6a54
--- /dev/null
+++ b/themes/hugo-pt2021/assets/bulma-0.9.3/sass/components/tabs.sass
@@ -0,0 +1,176 @@
+@import "../utilities/mixins"
+
+$tabs-border-bottom-color: $border !default
+$tabs-border-bottom-style: solid !default
+$tabs-border-bottom-width: 1px !default
+$tabs-link-color: $text !default
+$tabs-link-hover-border-bottom-color: $text-strong !default
+$tabs-link-hover-color: $text-strong !default
+$tabs-link-active-border-bottom-color: $link !default
+$tabs-link-active-color: $link !default
+$tabs-link-padding: 0.5em 1em !default
+
+$tabs-boxed-link-radius: $radius !default
+$tabs-boxed-link-hover-background-color: $background !default
+$tabs-boxed-link-hover-border-bottom-color: $border !default
+
+$tabs-boxed-link-active-background-color: $scheme-main !default
+$tabs-boxed-link-active-border-color: $border !default
+$tabs-boxed-link-active-border-bottom-color: transparent !default
+
+$tabs-toggle-link-border-color: $border !default
+$tabs-toggle-link-border-style: solid !default
+$tabs-toggle-link-border-width: 1px !default
+$tabs-toggle-link-hover-background-color: $background !default
+$tabs-toggle-link-hover-border-color: $border-hover !default
+$tabs-toggle-link-radius: $radius !default
+$tabs-toggle-link-active-background-color: $link !default
+$tabs-toggle-link-active-border-color: $link !default
+$tabs-toggle-link-active-color: $link-invert !default
+
+.tabs
+ @extend %block
+ +overflow-touch
+ @extend %unselectable
+ align-items: stretch
+ display: flex
+ font-size: $size-normal
+ justify-content: space-between
+ overflow: hidden
+ overflow-x: auto
+ white-space: nowrap
+ a
+ align-items: center
+ border-bottom-color: $tabs-border-bottom-color
+ border-bottom-style: $tabs-border-bottom-style
+ border-bottom-width: $tabs-border-bottom-width
+ color: $tabs-link-color
+ display: flex
+ justify-content: center
+ margin-bottom: -#{$tabs-border-bottom-width}
+ padding: $tabs-link-padding
+ vertical-align: top
+ &:hover
+ border-bottom-color: $tabs-link-hover-border-bottom-color
+ color: $tabs-link-hover-color
+ li
+ display: block
+ &.is-active
+ a
+ border-bottom-color: $tabs-link-active-border-bottom-color
+ color: $tabs-link-active-color
+ ul
+ align-items: center
+ border-bottom-color: $tabs-border-bottom-color
+ border-bottom-style: $tabs-border-bottom-style
+ border-bottom-width: $tabs-border-bottom-width
+ display: flex
+ flex-grow: 1
+ flex-shrink: 0
+ justify-content: flex-start
+ &.is-left
+ padding-right: 0.75em
+ &.is-center
+ flex: none
+ justify-content: center
+ padding-left: 0.75em
+ padding-right: 0.75em
+ &.is-right
+ justify-content: flex-end
+ padding-left: 0.75em
+ .icon
+ &:first-child
+ +ltr-property("margin", 0.5em)
+ &:last-child
+ +ltr-property("margin", 0.5em, false)
+ // Alignment
+ &.is-centered
+ ul
+ justify-content: center
+ &.is-right
+ ul
+ justify-content: flex-end
+ // Styles
+ &.is-boxed
+ a
+ border: 1px solid transparent
+ +ltr
+ border-radius: $tabs-boxed-link-radius $tabs-boxed-link-radius 0 0
+ +rtl
+ border-radius: 0 0 $tabs-boxed-link-radius $tabs-boxed-link-radius
+ &:hover
+ background-color: $tabs-boxed-link-hover-background-color
+ border-bottom-color: $tabs-boxed-link-hover-border-bottom-color
+ li
+ &.is-active
+ a
+ background-color: $tabs-boxed-link-active-background-color
+ border-color: $tabs-boxed-link-active-border-color
+ border-bottom-color: $tabs-boxed-link-active-border-bottom-color !important
+ &.is-fullwidth
+ li
+ flex-grow: 1
+ flex-shrink: 0
+ &.is-toggle
+ a
+ border-color: $tabs-toggle-link-border-color
+ border-style: $tabs-toggle-link-border-style
+ border-width: $tabs-toggle-link-border-width
+ margin-bottom: 0
+ position: relative
+ &:hover
+ background-color: $tabs-toggle-link-hover-background-color
+ border-color: $tabs-toggle-link-hover-border-color
+ z-index: 2
+ li
+ & + li
+ +ltr-property("margin", -#{$tabs-toggle-link-border-width}, false)
+ &:first-child a
+ +ltr
+ border-top-left-radius: $tabs-toggle-link-radius
+ border-bottom-left-radius: $tabs-toggle-link-radius
+ +rtl
+ border-top-right-radius: $tabs-toggle-link-radius
+ border-bottom-right-radius: $tabs-toggle-link-radius
+ &:last-child a
+ +ltr
+ border-top-right-radius: $tabs-toggle-link-radius
+ border-bottom-right-radius: $tabs-toggle-link-radius
+ +rtl
+ border-top-left-radius: $tabs-toggle-link-radius
+ border-bottom-left-radius: $tabs-toggle-link-radius
+ &.is-active
+ a
+ background-color: $tabs-toggle-link-active-background-color
+ border-color: $tabs-toggle-link-active-border-color
+ color: $tabs-toggle-link-active-color
+ z-index: 1
+ ul
+ border-bottom: none
+ &.is-toggle-rounded
+ li
+ &:first-child a
+ +ltr
+ border-bottom-left-radius: $radius-rounded
+ border-top-left-radius: $radius-rounded
+ padding-left: 1.25em
+ +rtl
+ border-bottom-right-radius: $radius-rounded
+ border-top-right-radius: $radius-rounded
+ padding-right: 1.25em
+ &:last-child a
+ +ltr
+ border-bottom-right-radius: $radius-rounded
+ border-top-right-radius: $radius-rounded
+ padding-right: 1.25em
+ +rtl
+ border-bottom-left-radius: $radius-rounded
+ border-top-left-radius: $radius-rounded
+ padding-left: 1.25em
+ // Sizes
+ &.is-small
+ font-size: $size-small
+ &.is-medium
+ font-size: $size-medium
+ &.is-large
+ font-size: $size-large