diff options
Diffstat (limited to 'src/components/Widgets/SocialMedia/SocialMedia.module.scss')
| -rw-r--r-- | src/components/Widgets/SocialMedia/SocialMedia.module.scss | 48 |
1 files changed, 48 insertions, 0 deletions
diff --git a/src/components/Widgets/SocialMedia/SocialMedia.module.scss b/src/components/Widgets/SocialMedia/SocialMedia.module.scss new file mode 100644 index 0000000..c8ad759 --- /dev/null +++ b/src/components/Widgets/SocialMedia/SocialMedia.module.scss @@ -0,0 +1,48 @@ +@use "@styles/abstracts/functions" as fun; +@use "@styles/abstracts/placeholders"; + +.list { + @extend %flex-list; + + gap: var(--spacing-xs); + align-items: center; + padding: var(--spacing-2xs) 0 0 var(--spacing-2xs); +} + +.link { + display: block; + width: 3em; + height: 3em; + background: none; + box-shadow: fun.convert-px(1) fun.convert-px(1) fun.convert-px(1) + var(--color-shadow-light), + fun.convert-px(1) fun.convert-px(2) fun.convert-px(2) fun.convert-px(-1) + var(--color-shadow-light), + fun.convert-px(3) fun.convert-px(4) fun.convert-px(4) fun.convert-px(-3) + var(--color-shadow-light), + 0 0 0 0 var(--color-shadow); + transition: all 0.3s linear 0s; + + &:hover, + &:focus { + box-shadow: fun.convert-px(1) fun.convert-px(1) fun.convert-px(1) + var(--color-shadow-light), + fun.convert-px(1) fun.convert-px(1) fun.convert-px(2) fun.convert-px(-1) + var(--color-shadow-lighter), + fun.convert-px(3) fun.convert-px(3) fun.convert-px(4) fun.convert-px(-4) + var(--color-shadow-lighter), + fun.convert-px(6) fun.convert-px(6) fun.convert-px(10) fun.convert-px(-3) + var(--color-shadow-light); + transform: scale(1.15); + } + + &:focus { + outline: var(--color-primary) dashed fun.convert-px(2); + } + + &:active { + box-shadow: 0 0 0 0 var(--color-shadow-light); + outline: none; + transform: scale(0.9); + } +} |
