diff options
Diffstat (limited to 'static/assets/bulma/sass/layout')
-rw-r--r-- | static/assets/bulma/sass/layout/_all.sass | 6 | ||||
-rw-r--r-- | static/assets/bulma/sass/layout/footer.sass | 11 | ||||
-rw-r--r-- | static/assets/bulma/sass/layout/hero.sass | 153 | ||||
-rw-r--r-- | static/assets/bulma/sass/layout/section.sass | 17 |
4 files changed, 187 insertions, 0 deletions
diff --git a/static/assets/bulma/sass/layout/_all.sass b/static/assets/bulma/sass/layout/_all.sass new file mode 100644 index 0000000..4d1df5b --- /dev/null +++ b/static/assets/bulma/sass/layout/_all.sass @@ -0,0 +1,6 @@ +/* Bulma Layout */ +@charset "utf-8" + +@import "hero" +@import "section" +@import "footer" diff --git a/static/assets/bulma/sass/layout/footer.sass b/static/assets/bulma/sass/layout/footer.sass new file mode 100644 index 0000000..4e9187e --- /dev/null +++ b/static/assets/bulma/sass/layout/footer.sass @@ -0,0 +1,11 @@ +@import "../utilities/derived-variables" + +$footer-background-color: $scheme-main-bis !default +$footer-color: false !default +$footer-padding: 3rem 1.5rem 6rem !default + +.footer + background-color: $footer-background-color + padding: $footer-padding + @if $footer-color + color: $footer-color diff --git a/static/assets/bulma/sass/layout/hero.sass b/static/assets/bulma/sass/layout/hero.sass new file mode 100644 index 0000000..bd2312c --- /dev/null +++ b/static/assets/bulma/sass/layout/hero.sass @@ -0,0 +1,153 @@ +@import "../utilities/mixins" + +$hero-body-padding: 3rem 1.5rem !default +$hero-body-padding-tablet: 3rem 3rem !default +$hero-body-padding-small: 1.5rem !default +$hero-body-padding-medium: 9rem 4.5rem !default +$hero-body-padding-large: 18rem 6rem !default + +$hero-colors: $colors !default + +// Main container +.hero + align-items: stretch + display: flex + flex-direction: column + justify-content: space-between + .navbar + background: none + .tabs + ul + border-bottom: none + // Colors + @each $name, $pair in $hero-colors + $color: nth($pair, 1) + $color-invert: nth($pair, 2) + &.is-#{$name} + background-color: $color + color: $color-invert + a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current), + strong + color: inherit + .title + color: $color-invert + .subtitle + color: bulmaRgba($color-invert, 0.9) + a:not(.button), + strong + color: $color-invert + .navbar-menu + +touch + background-color: $color + .navbar-item, + .navbar-link + color: bulmaRgba($color-invert, 0.7) + a.navbar-item, + .navbar-link + &:hover, + &.is-active + background-color: bulmaDarken($color, 5%) + color: $color-invert + .tabs + a + color: $color-invert + opacity: 0.9 + &:hover + opacity: 1 + li + &.is-active a + color: $color !important + opacity: 1 + &.is-boxed, + &.is-toggle + a + color: $color-invert + &:hover + background-color: bulmaRgba($scheme-invert, 0.1) + li.is-active a + &, + &:hover + background-color: $color-invert + border-color: $color-invert + color: $color + // Modifiers + @if type-of($color) == 'color' + &.is-bold + $gradient-top-left: darken(saturate(adjust-hue($color, -10deg), 10%), 10%) + $gradient-bottom-right: lighten(saturate(adjust-hue($color, 10deg), 5%), 5%) + background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%) + +mobile + .navbar-menu + background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%) + // Sizes + &.is-small + .hero-body + padding: $hero-body-padding-small + &.is-medium + +tablet + .hero-body + padding: $hero-body-padding-medium + &.is-large + +tablet + .hero-body + padding: $hero-body-padding-large + &.is-halfheight, + &.is-fullheight, + &.is-fullheight-with-navbar + .hero-body + align-items: center + display: flex + & > .container + flex-grow: 1 + flex-shrink: 1 + &.is-halfheight + min-height: 50vh + &.is-fullheight + min-height: 100vh + +// Components + +.hero-video + @extend %overlay + overflow: hidden + video + left: 50% + min-height: 100% + min-width: 100% + position: absolute + top: 50% + transform: translate3d(-50%, -50%, 0) + // Modifiers + &.is-transparent + opacity: 0.3 + // Responsiveness + +mobile + display: none + +.hero-buttons + margin-top: 1.5rem + // Responsiveness + +mobile + .button + display: flex + &:not(:last-child) + margin-bottom: 0.75rem + +tablet + display: flex + justify-content: center + .button:not(:last-child) + +ltr-property("margin", 1.5rem) + +// Containers + +.hero-head, +.hero-foot + flex-grow: 0 + flex-shrink: 0 + +.hero-body + flex-grow: 1 + flex-shrink: 0 + padding: $hero-body-padding + +tablet + padding: $hero-body-padding-tablet diff --git a/static/assets/bulma/sass/layout/section.sass b/static/assets/bulma/sass/layout/section.sass new file mode 100644 index 0000000..9c5a9f4 --- /dev/null +++ b/static/assets/bulma/sass/layout/section.sass @@ -0,0 +1,17 @@ +@import "../utilities/mixins" + +$section-padding: 3rem 1.5rem !default +$section-padding-desktop: 3rem 3rem !default +$section-padding-medium: 9rem 4.5rem !default +$section-padding-large: 18rem 6rem !default + +.section + padding: $section-padding + // Responsiveness + +desktop + padding: $section-padding-desktop + // Sizes + &.is-medium + padding: $section-padding-medium + &.is-large + padding: $section-padding-large |