From ff79e0b7fc9b474075b532e22ae88bf049dbd53b Mon Sep 17 00:00:00 2001
From: KoloMl <thekolomoets@hotmail.com>
Date: Sun, 16 Feb 2025 03:17:32 +0400
Subject: [PATCH] Renaming booru colors to vars, adding several new variables

---
 src/styles/{booru-colors.scss => booru-vars.scss} | 4 ++++
 src/styles/content/listing.scss                   | 6 +++---
 2 files changed, 7 insertions(+), 3 deletions(-)
 rename src/styles/{booru-colors.scss => booru-vars.scss} (62%)

diff --git a/src/styles/booru-colors.scss b/src/styles/booru-vars.scss
similarity index 62%
rename from src/styles/booru-colors.scss
rename to src/styles/booru-vars.scss
index 5de64ab..1db638d 100644
--- a/src/styles/booru-colors.scss
+++ b/src/styles/booru-vars.scss
@@ -1,3 +1,7 @@
+$background-color: var(--background-color);
+$media-border: var(--media-border);
+$media-box-color: var(--media-box-color);
+
 // These variables are defined dynamically based on the category of the tag
 $resolved-tag-background: var(--tag-background);
 $resolved-tag-border: var(--tag-border);
diff --git a/src/styles/content/listing.scss b/src/styles/content/listing.scss
index a00b0b1..6edc8f7 100644
--- a/src/styles/content/listing.scss
+++ b/src/styles/content/listing.scss
@@ -1,5 +1,5 @@
 @use '$styles/colors';
-@use '$styles/booru-colors';
+@use '$styles/booru-vars';
 
 // This will fix wierd misplacing of the modified media boxes in the listing.
 .js-resizable-media-container {
@@ -67,8 +67,8 @@
       user-select: none;
 
       &:hover {
-        background: booru-colors.$resolved-tag-color;
-        color: booru-colors.$resolved-tag-background;
+        background: booru-vars.$resolved-tag-color;
+        color: booru-vars.$resolved-tag-background;
       }
 
       &.is-missing:not(.is-added),