diff options
author | Volpeon <git@volpeon.ink> | 2022-02-06 17:17:33 +0100 |
---|---|---|
committer | Volpeon <git@volpeon.ink> | 2022-02-06 17:17:33 +0100 |
commit | 3524f1bac11c8a9d1640bfeac5ceb063ff96d623 (patch) | |
tree | 52907b3161045c2d24bba18442c1ece9c12986a6 /src/_general.scss | |
parent | Updated action button (diff) | |
download | iro-design-3524f1bac11c8a9d1640bfeac5ceb063ff96d623.tar.gz iro-design-3524f1bac11c8a9d1640bfeac5ceb063ff96d623.tar.bz2 iro-design-3524f1bac11c8a9d1640bfeac5ceb063ff96d623.zip |
Improved variable structure
Diffstat (limited to 'src/_general.scss')
-rw-r--r-- | src/_general.scss | 21 |
1 files changed, 11 insertions, 10 deletions
diff --git a/src/_general.scss b/src/_general.scss index e03d0b3..1e7c180 100644 --- a/src/_general.scss +++ b/src/_general.scss | |||
@@ -1,5 +1,6 @@ | |||
1 | @use 'iro-sass/src/index' as iro; | 1 | @use 'iro-sass/src/index' as iro; |
2 | @use 'mixins/typography'; | 2 | @use 'mixins/typography'; |
3 | @use 'functions' as fn; | ||
3 | @use 'vars'; | 4 | @use 'vars'; |
4 | 5 | ||
5 | html, | 6 | html, |
@@ -8,12 +9,12 @@ body { | |||
8 | } | 9 | } |
9 | 10 | ||
10 | body { | 11 | body { |
11 | @include typography.set-font(vars.$font--main, (size: iro.props-get(--dims --font-size --md))); | 12 | @include typography.set-font(vars.$font--main, (size: fn.dim(--font-size --md))); |
12 | 13 | ||
13 | margin: 0; | 14 | margin: 0; |
14 | padding: 0; | 15 | padding: 0; |
15 | background-color: iro.props-get(--colors --bg); | 16 | background-color: fn.color(--bg); |
16 | color: iro.props-get(--colors --fg); | 17 | color: fn.color(--fg); |
17 | } | 18 | } |
18 | 19 | ||
19 | h1, | 20 | h1, |
@@ -22,13 +23,13 @@ h3, | |||
22 | h4, | 23 | h4, |
23 | h5, | 24 | h5, |
24 | h6 { | 25 | h6 { |
25 | @include typography.set-font(vars.$font--main, (size: iro.props-get(--dims --font-size --md), weight: 400)); | 26 | @include typography.set-font(vars.$font--main, (size: fn.dim(--font-size --md), weight: 400)); |
26 | 27 | ||
27 | margin: 0; | 28 | margin: 0; |
28 | } | 29 | } |
29 | 30 | ||
30 | p { | 31 | p { |
31 | margin-top: iro.props-get(--dims --paragraph --margin-top); | 32 | margin-top: fn.dim(--paragraph --margin-top); |
32 | margin-bottom: 0; | 33 | margin-bottom: 0; |
33 | 34 | ||
34 | &:empty { | 35 | &:empty { |
@@ -38,8 +39,8 @@ p { | |||
38 | 39 | ||
39 | ul, | 40 | ul, |
40 | ol { | 41 | ol { |
41 | margin: iro.props-get(--dims --paragraph --margin-top) 0 0; | 42 | margin: fn.dim(--paragraph --margin-top) 0 0; |
42 | padding-left: iro.props-get(--dims --list --indent); | 43 | padding-left: fn.dim(--list --indent); |
43 | } | 44 | } |
44 | 45 | ||
45 | :focus { | 46 | :focus { |
@@ -77,12 +78,12 @@ textarea { | |||
77 | } | 78 | } |
78 | 79 | ||
79 | ::selection { | 80 | ::selection { |
80 | background: iro.props-get(--colors --selection --bg); | 81 | background: fn.color(--selection --bg); |
81 | color: iro.props-get(--colors --selection --fg); | 82 | color: fn.color(--selection --fg); |
82 | } | 83 | } |
83 | 84 | ||
84 | img { | 85 | img { |
85 | &::selection { | 86 | &::selection { |
86 | background: iro.props-get(--colors --selection --bg-img); | 87 | background: fn.color(--selection --bg-img); |
87 | } | 88 | } |
88 | } | 89 | } |