diff options
Diffstat (limited to 'src/components/atoms/images/icons/hamburger-icon/hamburger-icon.module.scss')
| -rw-r--r-- | src/components/atoms/images/icons/hamburger-icon/hamburger-icon.module.scss | 45 |
1 files changed, 45 insertions, 0 deletions
diff --git a/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.module.scss b/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.module.scss new file mode 100644 index 0000000..8b8ad7e --- /dev/null +++ b/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.module.scss @@ -0,0 +1,45 @@ +@use "../../../../../styles/abstracts/functions" as fun; + +.wrapper { + display: flex; + align-items: center; + aspect-ratio: 1/1; + position: relative; +} + +.icon { + width: 100%; + + &, + &::before, + &::after { + display: block; + height: 20%; + background: var(--color-primary-lighter); + background-image: linear-gradient( + to right, + var(--color-primary-light) 0%, + var(--color-primary-lighter) 100% + ); + border: fun.convert-px(1) solid var(--color-primary-darker); + border-radius: fun.convert-px(4); + transition: + all 0.25s ease-in-out 0s, + transform 0.4s ease-in 0s; + } + + &::before, + &::after { + content: ""; + position: absolute; + inset-inline: 0; + } + + &::before { + top: 3%; + } + + &::after { + bottom: 3%; + } +} |
