From a8f2e2955b2975f63cd2984926f773902efb2304 Mon Sep 17 00:00:00 2001
From: mike <michael@appmodel.nl>
Date: Sun, 28 Dec 2025 00:31:27 +0100
Subject: [PATCH] refactor: extract CSS from index.html to style.css

Co-authored-by: aider (openai//models/qwen2.5-coder-32b-instruct-q4_k_m.gguf) <aider@aider.chat>
---
 index.html | 99 +-----------------------------------------------------
 style.css  | 96 ++++++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 97 insertions(+), 98 deletions(-)

diff --git a/index.html b/index.html
index 326bc41..756ba48 100644
--- a/index.html
+++ b/index.html
@@ -4,104 +4,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Chat</title>
-    <!-- Darker markdown styling -->
-    <style>
-    .markdown-content {
-       color: #24292f;
-       font-size: 15px;
-       line-height: 1.6;
-    }
-
-    .markdown-content h1, .markdown-content h2, .markdown-content h3 {
-       color: #1a1a1a;
-       border-bottom: 1px solid #eaecef;
-       padding-bottom: 0.3em;
-       margin-top: 1.5em;
-       margin-bottom: 0.8em;
-    }
-
-    .markdown-content h1 {
-       font-size: 1.8em;
-    }
-
-    .markdown-content h2 {
-       font-size: 1.5em;
-    }
-
-    .markdown-content h3 {
-       font-size: 1.25em;
-    }
-
-    .markdown-content p {
-       margin: 0.8em 0;
-       color: #2d3339;
-    }
-
-    .markdown-content code {
-       background-color: #f6f8fa;
-       color: #d63384;
-       padding: 0.2em 0.4em;
-       border-radius: 3px;
-       font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
-       font-size: 0.9em;
-       user-select: text;
-    }
-
-    .markdown-content pre {
-       background-color: #0d1117;
-       color: #c9d1d9;
-       padding: 1em;
-       border-radius: 6px;
-       overflow-x: auto;
-       margin: 1em 0;
-       border: 1px solid #30363d;
-       user-select: text;
-    }
-
-    .markdown-content pre code {
-       background-color: transparent;
-       color: inherit;
-       padding: 0;
-    }
-
-    .markdown-content ul, .markdown-content ol {
-       padding-left: 1.8em;
-       margin: 0.8em 0;
-       color: #2d3339;
-    }
-
-    .markdown-content li {
-       margin: 0.3em 0;
-    }
-
-    .markdown-content blockquote {
-       border-left: 3px solid #d0d7de;
-       padding-left: 1em;
-       margin: 1em 0;
-       color: #57606a;
-    }
-
-    .markdown-content table {
-       border-collapse: collapse;
-       margin: 1em 0;
-       width: 100%;
-    }
-
-    .markdown-content th, .markdown-content td {
-       border: 1px solid #d0d7de;
-       padding: 0.5em 1em;
-       text-align: left;
-    }
-
-    .markdown-content th {
-       background-color: #f6f8fa;
-       font-weight: 600;
-    }
-
-    .markdown-content tr:nth-child(even) {
-       background-color: #f6f8fa;
-    }
-    </style>
+    <link rel="stylesheet" href="style.css">
     <!-- Markdown parser -->
     <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
     <!-- Optional: Highlight.js for better code syntax -->
diff --git a/style.css b/style.css
index e69de29..5952bc9 100644
--- a/style.css
+++ b/style.css
@@ -0,0 +1,96 @@
+/* Darker markdown styling */
+.markdown-content {
+   color: #24292f;
+   font-size: 15px;
+   line-height: 1.6;
+}
+
+.markdown-content h1, .markdown-content h2, .markdown-content h3 {
+   color: #1a1a1a;
+   border-bottom: 1px solid #eaecef;
+   padding-bottom: 0.3em;
+   margin-top: 1.5em;
+   margin-bottom: 0.8em;
+}
+
+.markdown-content h1 {
+   font-size: 1.8em;
+}
+
+.markdown-content h2 {
+   font-size: 1.5em;
+}
+
+.markdown-content h3 {
+   font-size: 1.25em;
+}
+
+.markdown-content p {
+   margin: 0.8em 0;
+   color: #2d3339;
+}
+
+.markdown-content code {
+   background-color: #f6f8fa;
+   color: #d63384;
+   padding: 0.2em 0.4em;
+   border-radius: 3px;
+   font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
+   font-size: 0.9em;
+   user-select: text;
+}
+
+.markdown-content pre {
+   background-color: #0d1117;
+   color: #c9d1d9;
+   padding: 1em;
+   border-radius: 6px;
+   overflow-x: auto;
+   margin: 1em 0;
+   border: 1px solid #30363d;
+   user-select: text;
+}
+
+.markdown-content pre code {
+   background-color: transparent;
+   color: inherit;
+   padding: 0;
+}
+
+.markdown-content ul, .markdown-content ol {
+   padding-left: 1.8em;
+   margin: 0.8em 0;
+   color: #2d3339;
+}
+
+.markdown-content li {
+   margin: 0.3em 0;
+}
+
+.markdown-content blockquote {
+   border-left: 3px solid #d0d7de;
+   padding-left: 1em;
+   margin: 1em 0;
+   color: #57606a;
+}
+
+.markdown-content table {
+   border-collapse: collapse;
+   margin: 1em 0;
+   width: 100%;
+}
+
+.markdown-content th, .markdown-content td {
+   border: 1px solid #d0d7de;
+   padding: 0.5em 1em;
+   text-align: left;
+}
+
+.markdown-content th {
+   background-color: #f6f8fa;
+   font-weight: 600;
+}
+
+.markdown-content tr:nth-child(even) {
+   background-color: #f6f8fa;
+}