diff options
author | Volpeon <git@volpeon.ink> | 2023-01-26 14:57:03 +0100 |
---|---|---|
committer | Volpeon <git@volpeon.ink> | 2023-01-26 14:57:03 +0100 |
commit | 967ea296bbac44741be46eaa5388a4ac9cfd8ab2 (patch) | |
tree | ab4ebf7fbaa6ed743208ccfa5346736f5e7db1ac /src | |
parent | Bubble group (diff) | |
download | iro-design-967ea296bbac44741be46eaa5388a4ac9cfd8ab2.tar.gz iro-design-967ea296bbac44741be46eaa5388a4ac9cfd8ab2.tar.bz2 iro-design-967ea296bbac44741be46eaa5388a4ac9cfd8ab2.zip |
Updates
Diffstat (limited to 'src')
-rw-r--r-- | src/objects/_avatar.scss | 12 | ||||
-rw-r--r-- | src/objects/_backdrop.scss | 2 | ||||
-rw-r--r-- | src/objects/_bubble.scss | 5 |
3 files changed, 19 insertions, 0 deletions
diff --git a/src/objects/_avatar.scss b/src/objects/_avatar.scss index 0dd7879..9be249f 100644 --- a/src/objects/_avatar.scss +++ b/src/objects/_avatar.scss | |||
@@ -51,6 +51,11 @@ | |||
51 | --h: 354, | 51 | --h: 354, |
52 | --s: 44%, | 52 | --s: 44%, |
53 | --l: 45%, | 53 | --l: 45%, |
54 | |||
55 | --key-focus: ( | ||
56 | --border: fn.global-color(--focus --fill), | ||
57 | --shadow: fn.global-color(--focus --shadow), | ||
58 | ), | ||
54 | ), | 59 | ), |
55 | ), 'colors'); | 60 | ), 'colors'); |
56 | 61 | ||
@@ -110,5 +115,12 @@ | |||
110 | } | 115 | } |
111 | } | 116 | } |
112 | } | 117 | } |
118 | |||
119 | @include iro.bem-at-theme('keyboard') { | ||
120 | &:focus { | ||
121 | border-color: fn.color(--key-focus --border); | ||
122 | box-shadow: inset 0 0 0 1px fn.color(--key-focus --border), fn.color(--key-focus --shadow); | ||
123 | } | ||
124 | } | ||
113 | } | 125 | } |
114 | } | 126 | } |
diff --git a/src/objects/_backdrop.scss b/src/objects/_backdrop.scss index e7f2cfd..7653a99 100644 --- a/src/objects/_backdrop.scss +++ b/src/objects/_backdrop.scss | |||
@@ -5,6 +5,7 @@ | |||
5 | @include iro.props-store(( | 5 | @include iro.props-store(( |
6 | --dims: ( | 6 | --dims: ( |
7 | --z-index: 10000, | 7 | --z-index: 10000, |
8 | --blur: 2em, | ||
8 | ), | 9 | ), |
9 | ), 'dims'); | 10 | ), 'dims'); |
10 | 11 | ||
@@ -32,5 +33,6 @@ | |||
32 | flex-direction: column; | 33 | flex-direction: column; |
33 | background-color: fn.color(--bg); | 34 | background-color: fn.color(--bg); |
34 | color: fn.global-color(--fg); | 35 | color: fn.global-color(--fg); |
36 | backdrop-filter: blur(fn.dim(--blur)); | ||
35 | } | 37 | } |
36 | } | 38 | } |
diff --git a/src/objects/_bubble.scss b/src/objects/_bubble.scss index 1259b4a..cae92a2 100644 --- a/src/objects/_bubble.scss +++ b/src/objects/_bubble.scss | |||
@@ -46,6 +46,11 @@ | |||
46 | transform: translate(.2em, .2em); | 46 | transform: translate(.2em, .2em); |
47 | } | 47 | } |
48 | 48 | ||
49 | @include iro.bem-elem('divider') { | ||
50 | margin-right: calc(--1 * fn.dim(--pad-x)); | ||
51 | margin-left: calc(--1 * fn.dim(--pad-x)); | ||
52 | } | ||
53 | |||
49 | @include iro.bem-modifier('compact') { | 54 | @include iro.bem-modifier('compact') { |
50 | padding: fn.dim(--compact --pad-y) fn.dim(--compact --pad-x); | 55 | padding: fn.dim(--compact --pad-y) fn.dim(--compact --pad-x); |
51 | } | 56 | } |