From d1c85c8a73e86d5708484157bccb04fef42662a9 Mon Sep 17 00:00:00 2001
From: Gergely Polonkai <gergely@polonkai.eu>
Date: Fri, 6 Jun 2025 00:24:03 +0200
Subject: [PATCH] refactor: Move CSS Reset to a separate CSS file
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Although i wanted to keep everything in one file, it’s easier to develop this way.
---
 index.html       | 52 +-----------------------------------------------
 static/reset.css | 50 ++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 51 insertions(+), 51 deletions(-)
 create mode 100644 static/reset.css

diff --git a/index.html b/index.html
index 5aac95f..202f72a 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,7 @@
         <meta charset="utf-8">
         <meta name="viewport" content="width=device-width, height=device-height, initial-scale: 1">
         <title>Cypher Player Assistant</title>
+        <link rel="stylesheet" type="text/css" href="static/reset.css">
         <style>
          :root {
              /* Dark Color Scheme */
@@ -78,57 +79,6 @@
              }
          }
 
-         /* CSS Reset */
-
-         *, *::before, *::after {
-             box-sizing: border-box;
-         }
-
-         ul[class], ol[class] {
-             padding: 0;
-         }
-
-         body, h1, h2, h3, h4, p, ul[class], ol[class], li, figure, figcaption, blockquote, dl, dd {
-             margin: 0;
-         }
-
-         body {
-             min-height: 100vh;
-             scroll-behavior: smooth;
-             text-rendering: optimizeSpeed;
-             line-height: 1.5;
-         }
-
-         ul[class], ol[class] {
-             list-style: none;
-         }
-
-         a:not([class]) {
-             text-decoration-skip-ink: auto;
-         }
-
-         img {
-             max-width: 100%;
-             display: block;
-         }
-
-         article > * + * {
-             margin-top: 1em;
-         }
-
-         input, button, textarea, select {
-             font: inherit;
-         }
-
-         @media(prefers-reduced-motion: reduce) {
-             * {
-                 animation-duration: 0.01ms !important;
-                 animation-iteration-count: 1 !important;
-                 transition-duration: 0.01ms !important;
-                 scroll-behavior: auto !important;
-             }
-         }
-
          /* Actual page style */
 
          .color-scheme-wrapper {
diff --git a/static/reset.css b/static/reset.css
new file mode 100644
index 0000000..f590039
--- /dev/null
+++ b/static/reset.css
@@ -0,0 +1,50 @@
+/* CSS Reset */
+
+*, *::before, *::after {
+    box-sizing: border-box;
+}
+
+ul[class], ol[class] {
+    padding: 0;
+}
+
+body, h1, h2, h3, h4, p, ul[class], ol[class], li, figure, figcaption, blockquote, dl, dd {
+    margin: 0;
+}
+
+body {
+    min-height: 100vh;
+    scroll-behavior: smooth;
+    text-rendering: optimizeSpeed;
+    line-height: 1.5;
+}
+
+ul[class], ol[class] {
+    list-style: none;
+}
+
+a:not([class]) {
+    text-decoration-skip-ink: auto;
+}
+
+img {
+    max-width: 100%;
+    display: block;
+}
+
+article > * + * {
+    margin-top: 1em;
+}
+
+input, button, textarea, select {
+    font: inherit;
+}
+
+@media(prefers-reduced-motion: reduce) {
+    * {
+        animation-duration: 0.01ms !important;
+        animation-iteration-count: 1 !important;
+        transition-duration: 0.01ms !important;
+        scroll-behavior: auto !important;
+    }
+}