Fix mobile menu not showing top and bottom strokes

2 files changed, 17 insertions, 25 deletions

diff --git a/assets/css/partials/burger-menu.css b/assets/css/partials/burger-menu.css
index 91e4101..71eb500 100644
--- a/assets/css/partials/burger-menu.css
+++ b/assets/css/partials/burger-menu.css
@@ -32,34 +32,29 @@
   user-select: none;
 }
 
-.toggleBurgerWrapper span {
+.toggleBurgerWrapper span,
+.toggleBurgerWrapper span:before,
+.toggleBurgerWrapper span:after {
   position: absolute;
-  top: 50%;
   height: 2px;
   width: 100%;
   background: var(--grey-222);
-
   transition: all .3s ease;
-  transform: translate(0, -50%);
 }
 
-.toggleBurgerWrapper span:before,
-.toggleBurgerWrapper span:before:after {
-  position: absolute;
-  height: 2px;
-  width: 100%;
-  background: var(--grey-222);
-  content: "";
-
-  transition: all .3s ease;
+.toggleBurgerWrapper span {
+  top: 50%;
+  transform: translate(0, -50%);
 }
 
 .toggleBurgerWrapper span:before {
   top: -6px;
+  content: "";
 }
 
 .toggleBurgerWrapper span:after {
   top: 6px;
+  content: "";
 }
 
 @media screen and (max-width: 800px) {
diff --git a/assets/css/partials/header-separator.css b/assets/css/partials/header-separator.css
index e1e5358..3c02cd1 100644
--- a/assets/css/partials/header-separator.css
+++ b/assets/css/partials/header-separator.css
@@ -1,28 +1,25 @@
-.header-content-separator {
-  position: relative;
-  margin: 40px auto;
+.header-content-separator,
+.header-content-separator:before,
+.header-content-separator:after {
   width: 4px;
   height: 4px;
   border-radius: 50%;
   background: var(--grey-ccc);
 }
 
+.header-content-separator {
+  position: relative;
+  margin: 40px auto;
+}
+
 .header-content-separator:before {
   position: absolute;
   left: -8px;
-  width: 4px;
-  height: 4px;
-  border-radius: 50%;
-  background: var(--grey-ccc);
   content: "";
 }
 
-.header-content-separator::after {
+.header-content-separator:after {
   position: absolute;
   left: 8px;
-  width: 4px;
-  height: 4px;
-  border-radius: 50%;
-  background: var(--grey-ccc);
   content: "";
 }