summaryrefslogtreecommitdiffstats
path: root/src/components/atoms/icons/hamburger.module.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/atoms/icons/hamburger.module.scss')
-rw-r--r--src/components/atoms/icons/hamburger.module.scss33
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);
}
}