mirror of
https://github.com/tcsenpai/obsidiangarden_netlify.git
synced 2025-06-07 05:05:20 +00:00
Better admonitions support
This commit is contained in:
parent
8049a354cd
commit
bec105bd14
10
.eleventy.js
10
.eleventy.js
@ -26,7 +26,14 @@ module.exports = function(eleventyConfig) {
|
||||
}
|
||||
if (token.info.startsWith("ad-")) {
|
||||
const code = token.content.trim();
|
||||
return `<pre class="language-${token.info}">${md.render(code)}</pre>`;
|
||||
if (code && code.toLowerCase().startsWith("title:")) {
|
||||
const title = `<div class="admonition-title">${code.substring(6, code.indexOf("\n"))}</div>`;
|
||||
return `<div class="language-${token.info} admonition admonition-example admonition-plugin">${title}${md.render(code.slice(code.indexOf("\n")))}</div>`;
|
||||
}
|
||||
|
||||
const title = `<div class="admonition-title">${token.info.charAt(3).toUpperCase()}${token.info.substring(4).toLowerCase()}</div>`;
|
||||
return `<div class="language-${token.info} admonition admonition-example admonition-plugin">${title}${md.render(code)}</div>`;
|
||||
|
||||
}
|
||||
|
||||
// Other languages
|
||||
@ -106,7 +113,6 @@ module.exports = function(eleventyConfig) {
|
||||
})
|
||||
|
||||
eleventyConfig.addTransform('highlight', function(str) {
|
||||
//replace ==random text== with <mark>random text</mark>
|
||||
return str && str.replace(/\=\=(.*?)\=\=/g, function(match, p1) {
|
||||
return `<mark>${p1}</mark>`;
|
||||
});
|
||||
|
4
.env
4
.env
@ -1,2 +1,2 @@
|
||||
THEME=https://raw.githubusercontent.com/colineckert/obsidian-things/main/obsidian.css
|
||||
BASE_THEME=light
|
||||
#THEME=https://raw.githubusercontent.com/colineckert/obsidian-things/main/obsidian.css
|
||||
#BASE_THEME=dark
|
@ -101,7 +101,14 @@ div.translusion {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
pre[class*="language-ad-"]::before {
|
||||
.admonition-title {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
left: 55px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
div[class*="language-ad-"]::before {
|
||||
display: block;
|
||||
font-size: 1.4rem;
|
||||
margin-bottom: 10px;
|
||||
@ -112,11 +119,9 @@ code[class*="language-ad-"] {
|
||||
white-space: normal !important;
|
||||
}
|
||||
|
||||
pre[class*="language-ad-"] {
|
||||
div[class*="language-ad-"] {
|
||||
font-family: 'Roboto', sans-serif;
|
||||
word-wrap: break-word;
|
||||
background-color: #3b2e58;
|
||||
border: 1px solid #3b2e58;
|
||||
border-radius: 6px;
|
||||
color: rgb(230, 230, 230);
|
||||
display: block;
|
||||
@ -130,51 +135,226 @@ pre[class*="language-ad-"] {
|
||||
white-space: normal !important;
|
||||
}
|
||||
|
||||
pre.language-ad-note::before {
|
||||
content: "🖊️ Note";
|
||||
div.language-ad-note::before {
|
||||
content: "🖊️";
|
||||
}
|
||||
|
||||
pre.language-ad-tip::before {
|
||||
content: "💡 Tip";
|
||||
div.language-ad-tip::before {
|
||||
content: "💡";
|
||||
}
|
||||
|
||||
pre.language-ad-warning::before {
|
||||
content: "⚠️ Warning";
|
||||
div.language-ad-warning::before {
|
||||
content: "⚠️";
|
||||
}
|
||||
|
||||
pre.language-ad-important::before {
|
||||
content: "❗️ Important";
|
||||
div.language-ad-important::before {
|
||||
content: "❗️";
|
||||
}
|
||||
|
||||
pre.language-ad-caution::before {
|
||||
content: "⚠️ Caution";
|
||||
div.language-ad-caution::before {
|
||||
content: "⚠️";
|
||||
}
|
||||
|
||||
pre.language-ad-info::before {
|
||||
content: "ℹ Info";
|
||||
div.language-ad-info::before {
|
||||
content: "ℹ";
|
||||
}
|
||||
|
||||
pre.language-ad-tip {
|
||||
background-color: rgb(5, 75, 22);
|
||||
border-color: rgb(5, 75, 22);
|
||||
div.language-ad-example::before {
|
||||
content: "🗒️";
|
||||
}
|
||||
|
||||
pre.language-ad-warning {
|
||||
background-color: rgb(106, 75, 22);
|
||||
border-color: rgb(106, 75, 22);
|
||||
div.language-ad-seealso::before {
|
||||
content: "🖊️";
|
||||
}
|
||||
|
||||
pre.language-ad-important {
|
||||
background-color: rgb(0, 65, 115);
|
||||
border-color: rgb(0, 65, 115);
|
||||
div.language-ad-abstract::before {
|
||||
content: '📚'
|
||||
}
|
||||
|
||||
pre.language-ad-caution {
|
||||
background-color: rgb(99, 0, 1);
|
||||
border-color: rgb(99, 0, 1);
|
||||
div.language-ad-summary::before {
|
||||
content: '📚'
|
||||
}
|
||||
|
||||
pre.language-ad-info {
|
||||
background-color: #2e5854;
|
||||
border: 1px solid #2e5854;
|
||||
div.language-ad-tldr::before {
|
||||
content: '📚'
|
||||
}
|
||||
|
||||
div.language-ad-todo::before {
|
||||
content: '☑️'
|
||||
}
|
||||
|
||||
div.language-ad-hint::before {
|
||||
content: '🔥'
|
||||
}
|
||||
|
||||
div.language-ad-success::before {
|
||||
content: ✅
|
||||
}
|
||||
|
||||
div.language-ad-check::before {
|
||||
content: '✅'
|
||||
}
|
||||
|
||||
div.language-ad-done::before {
|
||||
content: '✅'
|
||||
}
|
||||
|
||||
div.language-ad-question::before {
|
||||
content: '❓'
|
||||
}
|
||||
|
||||
div.language-ad-help::before {
|
||||
content: '❓'
|
||||
}
|
||||
|
||||
div.language-ad-faq::before {
|
||||
content: '❓'
|
||||
}
|
||||
|
||||
div.language-ad-attention::before {
|
||||
content: '⚠️'
|
||||
}
|
||||
|
||||
div.language-ad-failure::before {
|
||||
content: '❌'
|
||||
}
|
||||
|
||||
div.language-ad-fail::before {
|
||||
content: '❌'
|
||||
}
|
||||
|
||||
div.language-ad-missing::before {
|
||||
content: '❌'
|
||||
}
|
||||
|
||||
div.language-ad-danger::before {
|
||||
content: '⚡'
|
||||
}
|
||||
|
||||
div.language-ad-error::before {
|
||||
content: '⚡'
|
||||
}
|
||||
|
||||
div.language-ad-bug::before {
|
||||
content: '🐞'
|
||||
}
|
||||
|
||||
div.language-ad-quote::before {
|
||||
content: '💬'
|
||||
}
|
||||
|
||||
div.language-ad-cite::before {
|
||||
content: '💬'
|
||||
}
|
||||
|
||||
div.language-ad-note {
|
||||
background-color: rgba(68, 138, 255, .1)
|
||||
}
|
||||
|
||||
div.language-ad-seealso {
|
||||
background-color: rgba(68, 138, 255, .1)
|
||||
}
|
||||
|
||||
div.language-ad-abstract {
|
||||
background-color: rgba(0, 176, 255, .1)
|
||||
}
|
||||
|
||||
div.language-ad-summary {
|
||||
background-color: rgba(0, 176, 255, .1)
|
||||
}
|
||||
|
||||
div.language-ad-tldr {
|
||||
background-color: rgba(0, 176, 255, .1)
|
||||
}
|
||||
|
||||
div.language-ad-info {
|
||||
background-color: rgba(0, 184, 212, .1)
|
||||
}
|
||||
|
||||
div.language-ad-todo {
|
||||
background-color: rgba(0, 184, 212, .1)
|
||||
}
|
||||
|
||||
div.language-ad-tip {
|
||||
background-color: rgba(0, 191, 165, .1)
|
||||
}
|
||||
|
||||
div.language-ad-hint {
|
||||
background-color: rgba(0, 191, 165, .1)
|
||||
}
|
||||
|
||||
div.language-ad-important {
|
||||
background-color: rgba(0, 191, 165, .1)
|
||||
}
|
||||
|
||||
div.language-ad-success {
|
||||
background-color: rgba(0, 200, 83, .1)
|
||||
}
|
||||
|
||||
div.language-ad-check {
|
||||
background-color: rgba(0, 200, 83, .1)
|
||||
}
|
||||
|
||||
div.language-ad-done {
|
||||
background-color: rgba(0, 200, 83, .1)
|
||||
}
|
||||
|
||||
div.language-ad-question {
|
||||
background-color: rgba(100, 221, 23, .1)
|
||||
}
|
||||
|
||||
div.language-ad-help {
|
||||
background-color: rgba(100, 221, 23, .1)
|
||||
}
|
||||
|
||||
div.language-ad-faq {
|
||||
background-color: rgba(100, 221, 23, .1)
|
||||
}
|
||||
|
||||
div.language-ad-warning {
|
||||
background-color: rgba(255, 145, 0, .1)
|
||||
}
|
||||
|
||||
div.language-ad-caution {
|
||||
background-color: rgba(255, 145, 0, .1)
|
||||
}
|
||||
|
||||
div.language-ad-attention {
|
||||
background-color: rgba(255, 145, 0, .1)
|
||||
}
|
||||
|
||||
div.language-ad-failure {
|
||||
background-color: rgba(255, 82, 82, .1)
|
||||
}
|
||||
|
||||
div.language-ad-fail {
|
||||
background-color: rgba(255, 82, 82, .1)
|
||||
}
|
||||
|
||||
div.language-ad-missing {
|
||||
background-color: rgba(255, 82, 82, .1)
|
||||
}
|
||||
|
||||
div.language-ad-danger {
|
||||
background-color: rgba(255, 23, 68, .1)
|
||||
}
|
||||
|
||||
div.language-ad-error {
|
||||
background-color: rgba(255, 23, 68, .1)
|
||||
}
|
||||
|
||||
div.language-ad-bug {
|
||||
background-color: rgba(245, 0, 87, .1)
|
||||
}
|
||||
|
||||
div.language-ad-example {
|
||||
background-color: rgba(124, 77, 255, .1)
|
||||
}
|
||||
|
||||
div.language-ad-quote {
|
||||
background-color: rgba(158, 158, 158, .1)
|
||||
}
|
||||
|
||||
div.language-ad-cite {
|
||||
background-color: rgba(158, 158, 158, .1)
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user