Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-23 13:29:35 -07:00
Code Issues Packages Projects Releases Wiki Activity

Add more CSS variables with fallback

Browse Source
This commit is contained in:
Jeremy Thomas
2020-08-27 09:57:33 +02:00
parent 42815a783d
commit 9f3adb4930
10 changed files with 63 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
sass/layout/footer.sass
View File

@@ -1,9 +1,13 @@
$footer-background-color: $scheme-main-bis !default
$footer-background-color: var(--scheme-main-bis, #{$scheme-main-bis}) !default
$footer-color: false !default
$footer-padding: 3rem 1.5rem 6rem !default
.footer
background-color: $footer-background-color
padding: $footer-padding
--footer-background-color: #{$footer-background-color}
--footer-padding: #{$footer-padding}
--footer-color: #{$footer-color}
background-color: var(--footer-background-color)
padding: var(--footer-padding)
@if $footer-color
color: $footer-color
color: var(--footer-color, #{$footer-color})

13
sass/layout/hero.sass
View File

@@ -5,6 +5,11 @@ $hero-body-padding-large: 18rem 1.5rem !default
// Main container
.hero
--hero-body-padding: #{$hero-body-padding}
--hero-body-padding-small: #{$hero-body-padding-small}
--hero-body-padding-medium: #{$hero-body-padding-medium}
--hero-body-padding-large: #{$hero-body-padding-large}
align-items: stretch
display: flex
flex-direction: column
@@ -76,15 +81,15 @@ $hero-body-padding-large: 18rem 1.5rem !default
// Sizes
&.is-small
.hero-body
padding: $hero-body-padding-small
--hero-body-padding: var(--hero-body-padding-small)
&.is-medium
+tablet
.hero-body
padding: $hero-body-padding-medium
--hero-body-padding: var(--hero-body-padding-medium)
&.is-large
+tablet
.hero-body
padding: $hero-body-padding-large
--hero-body-padding: var(--hero-body-padding-large)
&.is-halfheight,
&.is-fullheight,
&.is-fullheight-with-navbar
@@ -142,4 +147,4 @@ $hero-body-padding-large: 18rem 1.5rem !default
.hero-body
flex-grow: 1
flex-shrink: 0
padding: $hero-body-padding
padding: var(--hero-body-padding)

10
sass/layout/section.sass
View File

@@ -3,11 +3,15 @@ $section-padding-medium: 9rem 1.5rem !default
$section-padding-large: 18rem 1.5rem !default
.section
padding: $section-padding
--section-padding: #{$section-padding}
--section-padding-medium: #{$section-padding-medium}
--section-padding-large: #{$section-padding-large}
padding: var(--section-padding)
// Responsiveness
+desktop
// Sizes
&.is-medium
padding: $section-padding-medium
--section-padding: var(--section-padding-medium)
&.is-large
padding: $section-padding-large
--section-padding: var(--section-padding-large)