From babd08dfba3c5ccfe0c06cdd2a827520f87713b2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?V=C4=A9nh=20Ph=C6=B0=E1=BB=9Bc?= <vinhphuoc9919@gmail.com>
Date: Sat, 8 Mar 2025 15:03:05 +0700
Subject: [PATCH] chore: Move color variables

The themes should be able to decide all of its colors.
---
 assets/css/color/blue.scss   |  7 ++++++-
 assets/css/color/green.scss  |  7 ++++++-
 assets/css/color/orange.scss |  7 ++++++-
 assets/css/color/pink.scss   |  7 ++++++-
 assets/css/color/red.scss    |  7 ++++++-
 assets/css/variables.scss    | 13 ++-----------
 6 files changed, 32 insertions(+), 16 deletions(-)

diff --git a/assets/css/color/blue.scss b/assets/css/color/blue.scss
index 55dce5c..1988a58 100644
--- a/assets/css/color/blue.scss
+++ b/assets/css/color/blue.scss
@@ -1,3 +1,8 @@
 :root {
   --accent: #23B0FF;
-}
\ No newline at end of file
+  --accent-contrast-color: black;
+  --article-link-color: var(inherit);
+  --background: color-mix(in srgb, var(--accent) 2%, #1D1E28 98%);
+  --border-color: rgba(255, 255, 255, .1);
+  --color: white;
+}
diff --git a/assets/css/color/green.scss b/assets/css/color/green.scss
index ca21aaf..b7f8ce1 100644
--- a/assets/css/color/green.scss
+++ b/assets/css/color/green.scss
@@ -1,3 +1,8 @@
 :root {
   --accent: #78E2A0;
-}
\ No newline at end of file
+  --accent-contrast-color: black;
+  --article-link-color: var(inherit);
+  --background: color-mix(in srgb, var(--accent) 2%, #1D1E28 98%);
+  --border-color: rgba(255, 255, 255, .1);
+  --color: white;
+}
diff --git a/assets/css/color/orange.scss b/assets/css/color/orange.scss
index 93e3a72..f5f0d7e 100644
--- a/assets/css/color/orange.scss
+++ b/assets/css/color/orange.scss
@@ -1,3 +1,8 @@
 :root {
   --accent: #FFA86A;
-}
\ No newline at end of file
+  --accent-contrast-color: black;
+  --article-link-color: var(inherit);
+  --background: color-mix(in srgb, var(--accent) 2%, #1D1E28 98%);
+  --border-color: rgba(255, 255, 255, .1);
+  --color: white;
+}
diff --git a/assets/css/color/pink.scss b/assets/css/color/pink.scss
index c2a8b1c..73a0eac 100644
--- a/assets/css/color/pink.scss
+++ b/assets/css/color/pink.scss
@@ -1,3 +1,8 @@
 :root {
   --accent: #EE72F1;
-}
\ No newline at end of file
+  --accent-contrast-color: black;
+  --article-link-color: var(inherit);
+  --background: color-mix(in srgb, var(--accent) 2%, #1D1E28 98%);
+  --border-color: rgba(255, 255, 255, .1);
+  --color: white;
+}
diff --git a/assets/css/color/red.scss b/assets/css/color/red.scss
index f5b2016..30b0b15 100644
--- a/assets/css/color/red.scss
+++ b/assets/css/color/red.scss
@@ -1,3 +1,8 @@
 :root {
   --accent: #FF6266;
-}
\ No newline at end of file
+  --accent-contrast-color: black;
+  --article-link-color: var(inherit);
+  --background: color-mix(in srgb, var(--accent) 2%, #1D1E28 98%);
+  --border-color: rgba(255, 255, 255, .1);
+  --color: white;
+}
diff --git a/assets/css/variables.scss b/assets/css/variables.scss
index 9764e04..82d8599 100644
--- a/assets/css/variables.scss
+++ b/assets/css/variables.scss
@@ -1,15 +1,6 @@
-:root {
-  /* COLOR VARIABLES */
-  --background: color-mix(in srgb, var(--accent) 2%, #1D1E28 98%);
-  --accent-contrast-color: black;
-  --color: white;
-  --border-color: rgba(255, 255, 255, .1);
-  --article-link-color: var(inherit);
-}
-
-// Native CSS Variable aren't supported in a combination with MEDIA QUERIES. Wait for a new standard https://drafts.csswg.org/css-env-1/ 
+// Native CSS Variable aren't supported in a combination with MEDIA QUERIES. Wait for a new standard https://drafts.csswg.org/css-env-1/
 // --phone: "max-width: 684px";
 // --tablet: "max-width: 900px";
 
 $phone: 684px;
-$tablet: 900px;
\ No newline at end of file
+$tablet: 900px;