aboutsummaryrefslogtreecommitdiff
path: root/CSS/colorscheme.css
diff options
context:
space:
mode:
authorOxbian <oxbian@mailbox.org>2024-10-13 14:27:33 -0400
committerOxbian <oxbian@mailbox.org>2024-10-13 14:27:33 -0400
commit8e405bd43daa8a1ce7242e1a51b4008f42d3738e (patch)
tree01bfca4abd384c2978f20dc9ff5b6ab2fed0fc6f /CSS/colorscheme.css
parent157468b84553c47d0f5ba312d815ea7195b0d6b5 (diff)
downloadweb-template-main.tar.gz
web-template-main.zip
feat: CSS colorscheme file, to help define a global & uniform colorschememain
Diffstat (limited to 'CSS/colorscheme.css')
-rw-r--r--CSS/colorscheme.css64
1 files changed, 64 insertions, 0 deletions
diff --git a/CSS/colorscheme.css b/CSS/colorscheme.css
new file mode 100644
index 0000000..2db7aff
--- /dev/null
+++ b/CSS/colorscheme.css
@@ -0,0 +1,64 @@
+/* colorscheme css, here is defined all colors, night / light mode colors
+
+/* Root */
+:root
+{
+
+ /* Dark mode */
+ --dark-bg: #191919;
+ --dark-text: #BBBBBB;
+ --dark-link: #191919;
+ --dark-link-bg: #f08080;
+ --dark-title: #f08080;
+ --dark-quote-border: #fbc4ab; /* Quotebar color */
+ --dark-quote-bg: #3D3D3D;
+
+ /* Light mode */
+ --light-bg: #ffdab9;
+ --light-text: #191919;
+ --light-link: #191919;
+ --light-link-bg: #DE6E7C;
+ --light-title: #DE6E7C;
+ --light-quote-border: #6a040f; /* Quotebar color */
+ --light-quote-bg: #F9AD8A;
+
+ /* Default (will automatically be crushed by light/dark mode detection )*/
+ --bg-color: var(--dark-bg);
+ --text-color: var(--dark-text);
+ --link-color: var(--dark-link);
+ --link-bg-color: var(--dark-link-bg);
+ --title-color: var(--dark-title);
+ --quote-border: var(--dark-quote-border);
+ --quote-bg: var(--dark-quote-bg);
+}
+
+/* Night mode */
+@media (prefers-color-scheme: dark)
+{
+ :root
+ {
+ --bg-color: var(--dark-bg);
+ --text-color: var(--dark-text);
+ --link-color: var(--dark-link);
+ --link-bg-color: var(--dark-link-bg);
+ --title-color: var(--dark-title);
+ --quote-border: var(--dark-quote-border);
+ --quote-bg: var(--dark-quote-bg);
+ }
+}
+
+/* Day mode */
+@media (prefers-color-scheme: light)
+{
+ :root
+ {
+ --bg-color: var(--light-bg);
+ --text-color: var(--light-text);
+ --link-color: var(--light-link);
+ --link-bg-color: var(--light-link-bg);
+ --title-color: var(--light-title);
+ --quote-border: var(--light-quote-border);
+ --quote-bg: var(--light-quote-bg);
+ }
+}
+
ArKa projects. All rights to me, and your next child right arm.