Finish (?) code snippets, add to do regarding blockquote author
This commit is contained in:
@@ -1,3 +1,7 @@
|
||||
---
|
||||
// TODO: Handle author, etc., via inclusion of some sort of tag in the quote, either frontmatter tags or simply [author=Person Name]
|
||||
---
|
||||
|
||||
<div class="flex w-full items-center">
|
||||
<blockquote
|
||||
class="border-primary mx-auto my-8 max-w-xl border-l-6 py-2 pl-4 italic"
|
||||
|
@@ -17,10 +17,18 @@ if (dataMeta) {
|
||||
}
|
||||
|
||||
const languageIcons: Record<string, string> = {
|
||||
javascript: "mdi:language-javascript"
|
||||
javascript: "mdi:language-javascript",
|
||||
typescript: "mdi:language-typescript",
|
||||
csharp: "mdi:language-csharp",
|
||||
css: "mdi:language-css3",
|
||||
html: "mdi:language-html5",
|
||||
bash: "mdi:bash",
|
||||
astro: "simple-icons:astro"
|
||||
};
|
||||
|
||||
const languageIcon = languageIcons[props["data-language"]];
|
||||
const language = props["data-language"];
|
||||
|
||||
const languageIcon = languageIcons[language];
|
||||
|
||||
const title = meta.title;
|
||||
|
||||
@@ -28,31 +36,29 @@ const copyID = Math.random().toString(36);
|
||||
---
|
||||
|
||||
<figure class="my-4 rounded-b">
|
||||
{
|
||||
title && (
|
||||
<figcaption>
|
||||
<div class="bg-primary w-full rounded-t-md border-1 border-gray-600 px-4 py-2 text-white">
|
||||
<div class="flex justify-between">
|
||||
<div class="flex items-center justify-between gap-2 font-bold">
|
||||
{languageIcon && <Icon name={languageIcon} />}
|
||||
<p>{title}</p>
|
||||
</div>
|
||||
<button class="font-bold" id=`copy-${copyID}`>
|
||||
Copy <Icon name="mdi:content-copy" class="ml-0.5 inline-block" />
|
||||
</button>
|
||||
</div>
|
||||
<figcaption>
|
||||
<div
|
||||
class="bg-primary w-full rounded-t-md border-1 border-gray-600 px-4 py-2 text-white"
|
||||
>
|
||||
<div class="flex justify-between">
|
||||
<div class="flex items-center justify-between gap-2 font-bold">
|
||||
{languageIcon && <Icon name={languageIcon} />}
|
||||
{
|
||||
!languageIcon && language !== "plaintext" && (
|
||||
<p class="uppercase">{language}</p>
|
||||
)
|
||||
}
|
||||
{title && <p>{title}</p>}
|
||||
</div>
|
||||
</figcaption>
|
||||
)
|
||||
}
|
||||
<button class="font-bold" id=`copy-${copyID}`>
|
||||
Copy <Icon name="mdi:content-copy" class="ml-0.5 inline-block" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</figcaption>
|
||||
|
||||
<pre
|
||||
class:list={[
|
||||
"border-x border-b border-gray-600",
|
||||
"rounded-b",
|
||||
!title ? "rounded-t border-t" : "",
|
||||
className
|
||||
]}
|
||||
class:list={["border-x border-b border-gray-600", "rounded-b", className]}
|
||||
{...props}><slot /></pre>
|
||||
</figure>
|
||||
|
||||
|
@@ -96,7 +96,6 @@
|
||||
@apply inline-block;
|
||||
@apply w-full;
|
||||
@apply pr-8;
|
||||
@apply first:pt-2 last:pb-2;
|
||||
@apply bg-white dark:bg-gray-100;
|
||||
}
|
||||
|
||||
@@ -105,7 +104,7 @@
|
||||
counter-increment: step;
|
||||
|
||||
@apply w-10;
|
||||
@apply mr-5 ml-auto pr-2;
|
||||
@apply mr-2 ml-auto pt-1 pr-2 pb-1;
|
||||
@apply inline-block;
|
||||
@apply text-right;
|
||||
|
||||
|
Reference in New Issue
Block a user