Move styles to Header.astro

onwidget · Aug 20, 2022 · bd90eaf · bd90eaf
1 parent 5a2b07f
commit bd90eaf
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 8 deletions.
diff --git a/src/assets/styles/base.css b/src/assets/styles/base.css
@@ -6,12 +6,4 @@
   .btn {
     @apply inline-flex items-center justify-center rounded border border-transparent font-medium text-center text-base leading-snug transition py-3 px-6 shadow-lg ease-in duration-200 focus:ring-blue-500 focus:ring-offset-blue-200 focus:ring-2 focus:ring-offset-2;
   }
-}
-
-[data-aw-toggle-menu].expanded .line1 {
-  transform: rotate(-45deg) translate(-12px, 8px);
-}
-
-[data-aw-toggle-menu].expanded .line2 {
-  transform: rotate(45deg) translate(4px, -16px);
 }
diff --git a/src/components/widgets/Header.astro b/src/components/widgets/Header.astro
@@ -101,3 +101,13 @@ const {} = Astro.props;
     </nav>
   </div>
 </header>
+
+<style is:global>
+  [data-aw-toggle-menu].expanded .line1 {
+    transform: rotate(-45deg) translate(-12px, 8px);
+  }
+
+  [data-aw-toggle-menu].expanded .line2 {
+    transform: rotate(45deg) translate(4px, -16px);
+  }
+</style>