Add spacing.css and spacing_css.html partial

This commit is contained in:
Eryn Wells 2024-06-06 14:45:22 -07:00
parent d82cc11e28
commit 505dee6d90
2 changed files with 38 additions and 0 deletions

33
assets/css/spacing.css Normal file
View file

@ -0,0 +1,33 @@
/* spacing.css
* Eryn Wells <eryn@erynwells.me>
* vim: set sw=2 sts=2:
*/
{{ $spacingBase := 1 }}
{{ $spacingUnit := "em" }}
{{ $spacingFactor := 1.618 }}
{{ $scale := (dict
"xxs" -3
"xs" -2
"s" -1
"m" 1
"l" 2
"xl" 3
"xxl" 4
) }}
:root {
{{ range $name, $exponent := $scale }}
{{ $value := $spacingBase * (math.Pow $spacingFactor $exponent) }}
--spacing-{{ $name }}: {{ $value }}{{ $spacingUnit }};
{{ end }}
}
{{ range $name, $exponent := $scale }}
/* Spacing utility classes: {{ $name }} */
.sp-bls-{{ $name }} { margin-block-start: var(--spacing-{{ $name }}); }
.sp-ble-{{ $name }} { margin-block-end: var(--spacing-{{ $name }}); }
.sp-ins-{{ $name }} { margin-inline-start: var(--spacing-{{ $name }}); }
.sp-ine-{{ $name }} { margin-inline-end: var(--spacing-{{ $name }}); }
{{ end }}

View file

@ -0,0 +1,5 @@
{{
$spacingCSS := resources.Get "css/spacing.css"
| resources.ExecuteAsTemplate "spacing.css" .
}}
{{ return $spacingCSS }}