diff options
Diffstat (limited to 'src/components/atoms/icons/hamburger.module.scss')
| -rw-r--r-- | src/components/atoms/icons/hamburger.module.scss | 33 |
1 files changed, 9 insertions, 24 deletions
diff --git a/src/components/atoms/icons/hamburger.module.scss b/src/components/atoms/icons/hamburger.module.scss index 09e7e30..4fba4df 100644 --- a/src/components/atoms/icons/hamburger.module.scss +++ b/src/components/atoms/icons/hamburger.module.scss @@ -1,16 +1,21 @@ @use "@styles/abstracts/functions" as fun; -.icon { - display: block; +.wrapper { + display: flex; + align-items: center; width: var(--icon-size, #{fun.convert-px(50)}); height: var(--icon-size, #{fun.convert-px(50)}); position: relative; +} +.icon { &, &::before, &::after { display: block; height: fun.convert-px(7); + width: 100%; + position: absolute; background: var(--color-primary-lighter); background-image: linear-gradient( to right, @@ -25,33 +30,13 @@ &::before, &::after { content: ""; - position: absolute; - left: fun.convert-px(-1); - right: fun.convert-px(-1); } &::before { - bottom: fun.convert-px(15); + top: fun.convert-px(-15); } &::after { - top: fun.convert-px(15); - } - - &--active { - background: transparent; - border: transparent; - - &::before { - bottom: 0; - transform-origin: 50% 50%; - transform: rotate(45deg); - } - - &::after { - top: 0; - transform-origin: 50% 50%; - transform: rotate(-45deg); - } + bottom: fun.convert-px(-15); } } |
