src/components/MarkdownFile.vue

@@ -14,6 +14,12 @@ const props = defineProps<{
 const htmlContent = ref("");
 const loadedPage = ref("");
 
+var specialQuote: Map<string, { class: string; text: string }> = new Map();
+specialQuote.set("NOTE", { class: "info", text: "Information :" });
+specialQuote.set("SUCCESS", { class: "success", text: "Success :" });
+specialQuote.set("WARNING", { class: "warning", text: "Warning :" });
+specialQuote.set("DANGER", { class: "danger", text: "Danger :" });
+
 var renderer = new marked.Renderer();
 
 const toc = useTocStore();
@@ -33,6 +39,23 @@ renderer.heading = function (text, level, raw) {
   return `<h${level} id="${anchor}">${text}</h${level}>\n`;
 };
 
+renderer.blockquote = function (quote) {
+  console.log(quote);
+  var bqClass = "";
+  var newQuote = quote;
+  for (const [key, quoteData] of specialQuote) {
+    if (quote.includes(`[!${key}]`)) {
+      bqClass = `bg-${quoteData?.class}`;
+      newQuote = newQuote.replace(
+        `[!${key}]`,
+        `<strong>${quoteData?.text}</strong>`
+      );
+    }
+  }
+  newQuote = newQuote.replace("\n", "<br />");
+  return `<blockquote class="${bqClass}">${newQuote}</blockquote>`;
+};
+
 marked.setOptions({
   renderer: renderer,
 });

src/styles/definitions/_palette.scss

@@ -15,12 +15,12 @@ $whiteness_value: 0.8;
 
 $palette: (
   "brown":#876445,
-  "blue":#339af0,
+  "blue":#1c7ed6,
-  "violet":#845ef7,
+  "violet":#6741d9,
-  "red":#e33d22,
+  "red":#e03131,
-  "orange":#ff922b,
+  "orange":#e67700,
-  "green":#51cf66,
+  "green":#37b24d,
-  "skyblue":#3bc9db,
+  "skyblue":#1098ad,
   "dark": #343a40,
   "light":#fefefe,
   "yellow":#fcc419,