diff --git a/src/parser/markdown.ts b/src/parser/markdown.ts
index 20eaafc..7c8cb7d 100644
--- a/src/parser/markdown.ts
+++ b/src/parser/markdown.ts
@@ -65,8 +65,10 @@ mdit.use(anchor, {
placement: 'before',
}),
});
+mdit.use(githubAlerts, {
+ markers: '*'
+});
mdit.use(graphviz);
-mdit.use(githubAlerts);
mdit.use(mermaid);
const renderMarkdown: Renderer = (content: string) => {
diff --git a/static/colors.css b/static/colors.css
index d3bf14c..bba38e1 100644
--- a/static/colors.css
+++ b/static/colors.css
@@ -44,6 +44,8 @@
--alert-warning: #ffaf00;
--alert-caution: #ff5f5f;
+ --alert-custom-default: #c0c0c0;
+
--ipynb-bg-error: rgba(255, 0, 0, 0.1);
}
@@ -97,6 +99,8 @@
--alert-warning: #bf8700;
--alert-caution: #cf222e;
+ --alert-custom-default: #404040;
+
--ipynb-bg-error: rgba(255, 0, 0, 0.1);
}
}
diff --git a/static/markdown.css b/static/markdown.css
index e15c326..b8da31a 100644
--- a/static/markdown.css
+++ b/static/markdown.css
@@ -149,6 +149,14 @@ blockquote {
vertical-align: text-bottom;
fill: currentColor;
}
+/* default style for custom markers (Obsidian Callout style) */
+.markdown-alert {
+ border-left: .25rem solid var(--alert-custom-default);
+}
+.markdown-alert .markdown-alert-title {
+ color: var(--alert-custom-default);
+}
+/* default styles for GitHub style markers */
.markdown-alert-note {
border-left: .25rem solid var(--alert-note);
}
diff --git a/tests/rendering/markdown-additional.md b/tests/rendering/markdown-additional.md
index 28214ae..8bba8cb 100644
--- a/tests/rendering/markdown-additional.md
+++ b/tests/rendering/markdown-additional.md
@@ -42,11 +42,13 @@ While not a markdown syntax, this has a default style:
Press Ctrl + C to copy, and Ctrl + V to paste!
-## Custom attributes
+## Custom attribute
This paragraph has a red background color.{style=background-color:red}
-## Github alert blockquote
+## GitHub style alert
+
+### The 5 default GitHub style alerts
> [!NOTE]
> Something to take into account
@@ -63,7 +65,18 @@ This paragraph has a red background color.{style=background-color:red}
> [!CAUTION]
> Do not do this and that!
-With a custom title:
+### With a custom title
> [!NOTE] Foo bar
-> Hello
+> 'Note' with a custom title
+
+### Using custom markers ([Obsidian Callout](https://help.obsidian.md/Editing+and+formatting/Callouts) style)
+
+> [!CUSTOM]
+> Something more special
+
+> [!fOoBaR]
+> The marker is case-insensitive and turns into Title Case
+
+> [!CUSTOM] paY aTtEntiOn
+> You can use a custom title with a custom marker as well