From de6ed7ecc9fdefa737851bd359ad5a9876437fa8 Mon Sep 17 00:00:00 2001
From: Darakuu <elviost@gmail.com>
Date: Fri, 2 Feb 2024 20:08:19 +0100
Subject: [PATCH] Adds proper custom callouts

Adds new proper custom callouts, separated from Quartz's source code.
---
 quartz/plugins/transformers/ofm.ts |  3 ---
 quartz/styles/callouts.scss        | 12 ------------
 quartz/styles/custom.scss          | 22 ++++++++++------------
 3 files changed, 10 insertions(+), 27 deletions(-)

diff --git a/quartz/plugins/transformers/ofm.ts b/quartz/plugins/transformers/ofm.ts
index d4fd90a..44df3fa 100644
--- a/quartz/plugins/transformers/ofm.ts
+++ b/quartz/plugins/transformers/ofm.ts
@@ -72,9 +72,6 @@ const calloutMapping = {
   example: "example",
   quote: "quote",
   cite: "quote",
-  definition: "def",
-  def: "def",
-  application: "application"
 } as const
 
 function canonicalizeCallout(calloutName: string): keyof typeof calloutMapping {
diff --git a/quartz/styles/callouts.scss b/quartz/styles/callouts.scss
index 69f845e..7fa52c5 100644
--- a/quartz/styles/callouts.scss
+++ b/quartz/styles/callouts.scss
@@ -107,18 +107,6 @@
     --callout-icon: var(--callout-icon-example);
   }
 
-  &[data-callout="application"] {
-    --color: #c1efc1;
-    --border: #c1efc144;
-    --bg: #c1efc110;
-  }
-
-  &[data-callout="def"] {
-    --color: #a01e28;
-    --border: #a01e2866;
-    --bg: #a01e2811;
-  }
-
   &[data-callout="quote"] {
     --color: var(--secondary);
     --border: var(--lightgray);
diff --git a/quartz/styles/custom.scss b/quartz/styles/custom.scss
index dc3ecc5..80840ec 100644
--- a/quartz/styles/custom.scss
+++ b/quartz/styles/custom.scss
@@ -1,20 +1,18 @@
 @use "./base.scss";
 
-.callout[data-callout="application"] {
-    --callout-color: 193, 239, 193;
-    --callout-icon: lucide-wrench;
-}
-
-.callout[data-callout="definition"] {
-    --callout-color: 160, 30, 40;
-    --callout-icon: lucide-book;
-}
-
 .callout[data-callout="def"] {
-    --callout-color: 160, 30, 40;
-    --callout-icon: lucide-book;
+    --color: #a01e28;
+    --border: #a01e2866;
+    --bg: #a01e2811;
+    --callout-icon: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLWJvb2siPjxwYXRoIGQ9Ik00IDE5LjV2LTE1QTIuNSAyLjUgMCAwIDEgNi41IDJIMjB2MjBINi41YTIuNSAyLjUgMCAwIDEgMC01SDIwIi8+PC9zdmc+');
 }
 
+.callout[data-callout="application"] {
+    --color: #c1efc1;
+    --border: #c1efc144;
+    --bg: #c1efc110;
+    --callout-icon: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLXdyZW5jaCI+PHBhdGggZD0iTTE0LjcgNi4zYTEgMSAwIDAgMCAwIDEuNGwxLjYgMS42YTEgMSAwIDAgMCAxLjQgMGwzLjc3LTMuNzdhNiA2IDAgMCAxLTcuOTQgNy45NGwtNi45MSA2LjkxYTIuMTIgMi4xMiAwIDAgMS0zLTNsNi45MS02LjkxYTYgNiAwIDAgMSA3Ljk0LTcuOTRsLTMuNzYgMy43NnoiLz48L3N2Zz4=');
+}
 .article-title {
     font-weight: bold;
     text-decoration: underline;