From 76511230691b242a8846d48c571ee5175be19ccf Mon Sep 17 00:00:00 2001
From: uncenter <47499684+uncenter@users.noreply.github.com>
Date: Sat, 31 Aug 2024 03:36:10 -0400
Subject: [PATCH] refactor: use whiskers@v2 (#4)

refactor: update to whiskers v2
fix: don't always use mocha blue
---
 Makefile                          | 11 --------
 justfile                          |  5 ++++
 template/style.css                | 34 -----------------------
 theme.park.tera                   | 46 +++++++++++++++++++++++++++++++
 {flavors => themes}/frappe.css    |  2 +-
 {flavors => themes}/latte.css     |  2 +-
 {flavors => themes}/macchiato.css |  2 +-
 {flavors => themes}/mocha.css     |  2 +-
 8 files changed, 55 insertions(+), 49 deletions(-)
 delete mode 100644 Makefile
 create mode 100644 justfile
 delete mode 100644 template/style.css
 create mode 100644 theme.park.tera
 rename {flavors => themes}/frappe.css (95%)
 rename {flavors => themes}/latte.css (95%)
 rename {flavors => themes}/macchiato.css (95%)
 rename {flavors => themes}/mocha.css (95%)

diff --git a/Makefile b/Makefile
deleted file mode 100644
index 8d8524e..0000000
--- a/Makefile
+++ /dev/null
@@ -1,11 +0,0 @@
-.PHONY: all clean
-
-flavours := latte frappe macchiato mocha
-
-all: $(flavours)
-
-$(flavours):
-	whiskers template/style.css $@ > "flavors/$@.css"
-
-clean:
-	rm -fv flavors/*.css
diff --git a/justfile b/justfile
new file mode 100644
index 0000000..bdc61ae
--- /dev/null
+++ b/justfile
@@ -0,0 +1,5 @@
+_default:
+  @just --list
+
+build:
+  whiskers theme.park.tera
diff --git a/template/style.css b/template/style.css
deleted file mode 100644
index 3bc086f..0000000
--- a/template/style.css
+++ /dev/null
@@ -1,34 +0,0 @@
-:root {
-  --main-bg-color: #{{base}};
-
-  --modal-bg-color: #{{mantle}};
-  --modal-header-color: #{{crust}};
-  --modal-footer-color: #{{crust}};
-
-  --drop-down-menu-bg: #{{surface0}};
-
-  --button-color: #{{surface0}};
-  --button-color-hover: #{{surface1}};
-  --button-text: var(--text);
-  --button-text-hover: var(--text-hover);
-
-  --accent-color: 137, 180, 250; /* Mocha Blue */
-  --accent-color-hover: rgb(var(--accent-color), 0.8);
-  --link-color: var(--text);
-  --link-color-hover: #{{blue}};
-  --label-text-color: #fff; /* have to break convention here */
-
-  --text: #{{text}};
-  --text-hover: var(--text);
-  --text-muted: {{subtext0}};
-
-  /* Specials */
-  --arr-queue-color: #{{green}}; /* Servarr apps + Bazarr */
-  --plex-poster-unwatched: #{{peach}};
-  --petio-spinner: invert(66%) sepia(15%) saturate(1451%) hue-rotate(185deg) brightness(105%) contrast(96%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */ /* Blue */
-  --gitea-color-primary-dark-4: var(--accent-color);
-  --overseerr-gradient: linear-gradient(
-    var(--main-bg-color),
-    var(--main-bg-color)
-  ); /* Make sure this is compatible with whatever takes in the gradient */
-}
diff --git a/theme.park.tera b/theme.park.tera
new file mode 100644
index 0000000..f4f7043
--- /dev/null
+++ b/theme.park.tera
@@ -0,0 +1,46 @@
+---
+whiskers:
+  version: "2.3.0"
+  matrix:
+    - flavor
+  filename: "themes/{{ flavor.identifier }}.css"
+---
+
+{%- macro rgb(color) -%}
+{{ color.rgb.r }}, {{ color.rgb.g }}, {{ color.rgb.b }}
+{%- endmacro -%}
+
+:root {
+  --main-bg-color: #{{ base.hex }};
+
+  --modal-bg-color: #{{ mantle.hex }};
+  --modal-header-color: #{{ crust.hex }};
+  --modal-footer-color: #{{ crust.hex }};
+
+  --drop-down-menu-bg: #{{ surface0.hex }};
+
+  --button-color: #{{ surface0.hex }};
+  --button-color-hover: #{{ surface1.hex }};
+  --button-text: var(--text);
+  --button-text-hover: var(--text-hover);
+
+  --accent-color: {{ self::rgb(color=blue) }};
+  --accent-color-hover: rgb(var(--accent-color), 0.8);
+  --link-color: var(--text);
+  --link-color-hover: #{{ blue.hex }};
+  --label-text-color: #fff; /* have to break convention here */
+
+  --text: #{{ text.hex }};
+  --text-hover: var(--text);
+  --text-muted: {{ subtext0.hex }};
+
+  /* Specials */
+  --arr-queue-color: #{{ green.hex }}; /* Servarr apps + Bazarr */
+  --plex-poster-unwatched: #{{ peach.hex }};
+  --petio-spinner: invert(66%) sepia(15%) saturate(1451%) hue-rotate(185deg) brightness(105%) contrast(96%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */ /* Blue */
+  --gitea-color-primary-dark-4: var(--accent-color);
+  --overseerr-gradient: linear-gradient(
+    var(--main-bg-color),
+    var(--main-bg-color)
+  ); /* Make sure this is compatible with whatever takes in the gradient */
+}
diff --git a/flavors/frappe.css b/themes/frappe.css
similarity index 95%
rename from flavors/frappe.css
rename to themes/frappe.css
index 945e432..c5e17e5 100644
--- a/flavors/frappe.css
+++ b/themes/frappe.css
@@ -12,7 +12,7 @@
   --button-text: var(--text);
   --button-text-hover: var(--text-hover);
 
-  --accent-color: 137, 180, 250; /* Mocha Blue */
+  --accent-color: 140, 170, 238;
   --accent-color-hover: rgb(var(--accent-color), 0.8);
   --link-color: var(--text);
   --link-color-hover: #8caaee;
diff --git a/flavors/latte.css b/themes/latte.css
similarity index 95%
rename from flavors/latte.css
rename to themes/latte.css
index 56fce33..6fbe235 100644
--- a/flavors/latte.css
+++ b/themes/latte.css
@@ -12,7 +12,7 @@
   --button-text: var(--text);
   --button-text-hover: var(--text-hover);
 
-  --accent-color: 137, 180, 250; /* Mocha Blue */
+  --accent-color: 30, 102, 245;
   --accent-color-hover: rgb(var(--accent-color), 0.8);
   --link-color: var(--text);
   --link-color-hover: #1e66f5;
diff --git a/flavors/macchiato.css b/themes/macchiato.css
similarity index 95%
rename from flavors/macchiato.css
rename to themes/macchiato.css
index 4e533f9..b38d5f7 100644
--- a/flavors/macchiato.css
+++ b/themes/macchiato.css
@@ -12,7 +12,7 @@
   --button-text: var(--text);
   --button-text-hover: var(--text-hover);
 
-  --accent-color: 137, 180, 250; /* Mocha Blue */
+  --accent-color: 138, 173, 244;
   --accent-color-hover: rgb(var(--accent-color), 0.8);
   --link-color: var(--text);
   --link-color-hover: #8aadf4;
diff --git a/flavors/mocha.css b/themes/mocha.css
similarity index 95%
rename from flavors/mocha.css
rename to themes/mocha.css
index 3522092..0e5ae0e 100644
--- a/flavors/mocha.css
+++ b/themes/mocha.css
@@ -12,7 +12,7 @@
   --button-text: var(--text);
   --button-text-hover: var(--text-hover);
 
-  --accent-color: 137, 180, 250; /* Mocha Blue */
+  --accent-color: 137, 180, 250;
   --accent-color-hover: rgb(var(--accent-color), 0.8);
   --link-color: var(--text);
   --link-color-hover: #89b4fa;