fix(website): use light/dark html class

guilhermerodz · Jan 7, 2025 · 09259fd · 09259fd
1 parent 81ccdb4
commit 09259fd
Showing 1 changed file with 7 additions and 33 deletions.
diff --git a/apps/website/src/app/globals.css b/apps/website/src/app/globals.css
@@ -107,41 +107,15 @@
   @apply inline-block min-h-4 w-full py-0.5 px-4;
 }
 
-.code-example-overlay {
-  background-image: linear-gradient(
-    to bottom,
-    theme('colors.background') 60%,
-    transparent
-  );
-  transform: translateY(0);
-  animation: move-overlay 4s ease-out forwards;
-  animation-delay: 3s;
+html[class='light'] .code-example-light {
+  display: unset;
 }
-.code-example-light {
-}
-.code-example-dark {
+html[class='light'] .code-example-dark {
   display: none;
 }
-@media (prefers-color-scheme: dark) {
-  .code-example-light {
-    display: none;
-  }
-  .code-example-dark {
-    display: unset;
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .code-example-overlay {
-    opacity: 0;
-    animation: none;
-  }
+html[class='dark'] .code-example-dark {
+  display: unset;
 }
-@keyframes move-overlay {
-  0% {
-    transform: translateY(0);
-  }
-  100% {
-    transform: translateY(-100%);
-  }
+html[class='dark'] .code-example-light {
+  display: none;
 }