diff options
Diffstat (limited to 'src/objects/_badge.vars.scss')
| -rw-r--r-- | src/objects/_badge.vars.scss | 61 |
1 files changed, 28 insertions, 33 deletions
diff --git a/src/objects/_badge.vars.scss b/src/objects/_badge.vars.scss index 6a3dd15..c49474b 100644 --- a/src/objects/_badge.vars.scss +++ b/src/objects/_badge.vars.scss | |||
| @@ -43,35 +43,35 @@ $key-focus--outline-color: props.def(--o-avatar--key-focus--outline-color, props | |||
| 43 | 43 | ||
| 44 | $default-theme-override: () !default; | 44 | $default-theme-override: () !default; |
| 45 | $default-theme: props.def(--o-badge, ( | 45 | $default-theme: props.def(--o-badge, ( |
| 46 | --bg: props.def(--o-badge--bg-color, props.get(core.$theme, --text-mute)), | 46 | --bg: props.get(core.$theme, --text-mute), |
| 47 | --label: props.def(--o-badge--label-color, props.get(core.$theme, --bg-l2)), | 47 | --label: props.get(core.$theme, --bg-l2), |
| 48 | 48 | ||
| 49 | --hover: ( | 49 | --hover: ( |
| 50 | --bg: props.def(--o-badge--hover--bg-color, props.get(core.$theme, --text)), | 50 | --bg: props.get(core.$theme, --text), |
| 51 | --label: props.def(--o-badge--label-color, props.get(core.$theme, --bg-l2)), | 51 | --label: props.get(core.$theme, --bg-l2), |
| 52 | ), | 52 | ), |
| 53 | 53 | ||
| 54 | --active: ( | 54 | --active: ( |
| 55 | --bg: props.def(--o-badge--active--bg-color, props.get(core.$theme, --heading)), | 55 | --bg: props.get(core.$theme, --heading), |
| 56 | --label: props.def(--o-badge--label-color, props.get(core.$theme, --bg-l2)), | 56 | --label: props.get(core.$theme, --bg-l2), |
| 57 | ), | 57 | ), |
| 58 | 58 | ||
| 59 | --quiet: ( | 59 | --quiet: ( |
| 60 | --bg: props.def(--o-badge--quiet--bg-color, props.get(core.$theme, --border-mute)), | 60 | --bg: props.get(core.$theme, --border-mute), |
| 61 | --label: props.def(--o-badge--quiet--label-color, props.get(core.$theme, --heading)), | 61 | --label: props.get(core.$theme, --heading), |
| 62 | 62 | ||
| 63 | --hover: ( | 63 | --hover: ( |
| 64 | --bg: props.def(--o-badge--quiet--hover--bg-color, props.get(core.$theme, --border)), | 64 | --bg: props.get(core.$theme, --border), |
| 65 | --label: props.def(--o-badge--quiet--label-color, props.get(core.$theme, --heading)), | 65 | --label: props.get(core.$theme, --heading), |
| 66 | ), | 66 | ), |
| 67 | 67 | ||
| 68 | --active: ( | 68 | --active: ( |
| 69 | --bg: props.def(--o-badge--quiet--active--bg-color, props.get(core.$theme, --border-strong)), | 69 | --bg: props.get(core.$theme, --border-strong), |
| 70 | --label: props.def(--o-badge--quiet--label-color, props.get(core.$theme, --heading)), | 70 | --label: props.get(core.$theme, --heading), |
| 71 | ), | 71 | ), |
| 72 | ) | 72 | ) |
| 73 | )); | 73 | )); |
| 74 | $default-theme: props.merge(--o-badge, $default-theme-override); | 74 | $default-theme: props.merge($default-theme, $default-theme-override); |
| 75 | 75 | ||
| 76 | $static-themes: props.def(--o-badge); | 76 | $static-themes: props.def(--o-badge); |
| 77 | 77 | ||
| @@ -116,41 +116,36 @@ $static-themes: props.def(--o-badge); | |||
| 116 | )); | 116 | )); |
| 117 | } | 117 | } |
| 118 | 118 | ||
| 119 | $themes-config: ( | 119 | $themes-config: --accent --positive --negative --warning !default; |
| 120 | accent: --accent, | ||
| 121 | positive: --positive, | ||
| 122 | negative: --negative, | ||
| 123 | warning: --warning, | ||
| 124 | ) !default; | ||
| 125 | 120 | ||
| 126 | $themes: props.def(--o-badge); | 121 | $themes: props.def(--o-badge); |
| 127 | 122 | ||
| 128 | @each $theme, $key in $themes-config { | 123 | @each $theme in $themes-config { |
| 129 | $themes: props.merge($themes, ( | 124 | $themes: props.merge($themes, ( |
| 130 | $key: ( | 125 | $theme: ( |
| 131 | --bg: props.get(core.$static-colors, $key, --900), | 126 | --bg: props.get(core.$static-colors, $theme, --900), |
| 132 | --label: props.get(core.$static-colors, $key, --900-text), | 127 | --label: props.get(core.$static-colors, $theme, --900-text), |
| 133 | 128 | ||
| 134 | --hover: ( | 129 | --hover: ( |
| 135 | --bg: props.get(core.$static-colors, $key, --1000), | 130 | --bg: props.get(core.$static-colors, $theme, --1000), |
| 136 | --label: props.get(core.$static-colors, $key, --1000-text), | 131 | --label: props.get(core.$static-colors, $theme, --1000-text), |
| 137 | ), | 132 | ), |
| 138 | 133 | ||
| 139 | --active: ( | 134 | --active: ( |
| 140 | --bg: props.get(core.$static-colors, $key, --1100), | 135 | --bg: props.get(core.$static-colors, $theme, --1100), |
| 141 | --label: props.get(core.$static-colors, $key, --1000-text), | 136 | --label: props.get(core.$static-colors, $theme, --1000-text), |
| 142 | ), | 137 | ), |
| 143 | 138 | ||
| 144 | --quiet: ( | 139 | --quiet: ( |
| 145 | --bg: props.get(core.$theme, $key, --200), | 140 | --bg: props.get(core.$theme, $theme, --200), |
| 146 | --label: props.get(core.$theme, $key, --1100), | 141 | --label: props.get(core.$theme, $theme, --1100), |
| 147 | --hover: ( | 142 | --hover: ( |
| 148 | --bg: props.get(core.$theme, $key, --300), | 143 | --bg: props.get(core.$theme, $theme, --300), |
| 149 | --label: props.get(core.$theme, $key, --1200), | 144 | --label: props.get(core.$theme, $theme, --1200), |
| 150 | ), | 145 | ), |
| 151 | --active: ( | 146 | --active: ( |
| 152 | --bg: props.get(core.$theme, $key, --400), | 147 | --bg: props.get(core.$theme, $theme, --400), |
| 153 | --label: props.get(core.$theme, $key, --1300), | 148 | --label: props.get(core.$theme, $theme, --1300), |
| 154 | ), | 149 | ), |
| 155 | ) | 150 | ) |
| 156 | ) | 151 | ) |
