diff options
author | Volpeon <git@volpeon.ink> | 2023-11-09 11:04:06 +0100 |
---|---|---|
committer | Volpeon <git@volpeon.ink> | 2023-11-09 11:04:06 +0100 |
commit | 5b3cb27f73012404c4d8c7c41746de560e6246c7 (patch) | |
tree | 6bba29f41839b8be0017462a48f8f250f0f7e075 /src/objects/_bubble.scss | |
parent | Changed bubble group spacing implementation (diff) | |
download | iro-design-5b3cb27f73012404c4d8c7c41746de560e6246c7.tar.gz iro-design-5b3cb27f73012404c4d8c7c41746de560e6246c7.tar.bz2 iro-design-5b3cb27f73012404c4d8c7c41746de560e6246c7.zip |
Simplified bubble arrows
Diffstat (limited to 'src/objects/_bubble.scss')
-rw-r--r-- | src/objects/_bubble.scss | 27 |
1 files changed, 3 insertions, 24 deletions
diff --git a/src/objects/_bubble.scss b/src/objects/_bubble.scss index 477f475..d91b6d1 100644 --- a/src/objects/_bubble.scss +++ b/src/objects/_bubble.scss | |||
@@ -4,10 +4,9 @@ | |||
4 | @include iro.props-namespace('bubble') { | 4 | @include iro.props-namespace('bubble') { |
5 | @include iro.props-store(( | 5 | @include iro.props-store(( |
6 | --dims: ( | 6 | --dims: ( |
7 | --pad-x: fn.global-dim(--size --200), | 7 | --pad-x: fn.global-dim(--size --200), |
8 | --pad-y: fn.global-dim(--size --150), | 8 | --pad-y: fn.global-dim(--size --150), |
9 | --rounding: 0, | 9 | --rounding: 0, |
10 | --arrow-size: fn.global-dim(--size --100), | ||
11 | 10 | ||
12 | --75: ( | 11 | --75: ( |
13 | --pad-x: fn.global-dim(--size --150), | 12 | --pad-x: fn.global-dim(--size --150), |
@@ -29,26 +28,6 @@ | |||
29 | background-color: fn.global-color(--bg); | 28 | background-color: fn.global-color(--bg); |
30 | color: fn.global-color(--fg); | 29 | color: fn.global-color(--fg); |
31 | 30 | ||
32 | &::before, | ||
33 | &::after { | ||
34 | content: ''; | ||
35 | display: none; | ||
36 | position: absolute; | ||
37 | top: 0; | ||
38 | border: fn.dim(--arrow-size) solid fn.global-color(--bg); | ||
39 | border-bottom-color: transparent; | ||
40 | } | ||
41 | |||
42 | &::before { | ||
43 | left: calc(-1 * fn.dim(--arrow-size)); | ||
44 | border-left-color: transparent; | ||
45 | } | ||
46 | |||
47 | &::after { | ||
48 | right: calc(-1 * fn.dim(--arrow-size)); | ||
49 | border-right-color: transparent; | ||
50 | } | ||
51 | |||
52 | @include iro.bem-modifier('highlight') { | 31 | @include iro.bem-modifier('highlight') { |
53 | box-shadow: -3px 0 0 0 fn.color(--highlight); | 32 | box-shadow: -3px 0 0 0 fn.color(--highlight); |
54 | } | 33 | } |