Move styles to Header.astro

prototypa · prototypa · commit bd90eaf84145 · 2022-08-20T03:59:16.000-04:00
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>

Original file line number	Diff line number	Diff line change
`@@ -6,12 +6,4 @@`
`6`	`6`	`.btn {`
`7`	`7`	`@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;`
`8`	`8`	`}`
`9`		`-}`
`10`		`-`
`11`		`-[data-aw-toggle-menu].expanded .line1 {`
`12`		`- transform: rotate(-45deg) translate(-12px, 8px);`
`13`		`-}`
`14`		`-`
`15`		`-[data-aw-toggle-menu].expanded .line2 {`
`16`		`- transform: rotate(45deg) translate(4px, -16px);`
`17`	`9`	`}`