summaryrefslogtreecommitdiff
path: root/src/components
diff options
context:
space:
mode:
authorYuval Adam <_@yuv.al>2025-05-21 17:59:44 +0200
committerYuval Adam <_@yuv.al>2025-05-21 17:59:44 +0200
commitf043c0bae4242f117bf3ea545228709e11db6a2e (patch)
treeb761d07e5559650f90116dba73bcedf93ed6cc76 /src/components
parent10a5f6c5d9280bd375db64f6581d9a554ce2c496 (diff)
Initial guide
Diffstat (limited to 'src/components')
-rw-r--r--src/components/Prose.astro27
1 files changed, 27 insertions, 0 deletions
diff --git a/src/components/Prose.astro b/src/components/Prose.astro
new file mode 100644
index 0000000..aecfca2
--- /dev/null
+++ b/src/components/Prose.astro
@@ -0,0 +1,27 @@
+---
+// Prose component for styling markdown content
+---
+
+<div
+ class="prose prose-lg max-w-none mx-auto px-4 sm:px-6 lg:px-8 py-8
+ prose-headings:font-bold prose-headings:text-gray-900 prose-headings:mb-4 prose-headings:mt-8
+ prose-h1:text-4xl prose-h1:mt-0
+ prose-h2:text-2xl prose-h2:border-b prose-h2:border-gray-200 prose-h2:pb-2
+ prose-h3:text-xl
+ prose-p:text-gray-700 prose-p:my-4 prose-p:leading-relaxed
+ prose-a:text-blue-600 prose-a:font-medium prose-a:no-underline hover:prose-a:underline
+ prose-strong:font-bold prose-strong:text-gray-900
+ prose-ul:my-6 prose-ul:list-disc prose-ul:pl-6
+ prose-ol:my-6 prose-ol:list-decimal prose-ol:pl-6
+ prose-li:my-2 prose-li:text-gray-700
+ prose-blockquote:border-l-4 prose-blockquote:border-blue-500 prose-blockquote:pl-4 prose-blockquote:py-1 prose-blockquote:my-6 prose-blockquote:bg-blue-50 prose-blockquote:rounded-r-md
+ prose-blockquote:text-gray-700 prose-blockquote:italic
+ prose-img:rounded-lg prose-img:shadow-md prose-img:my-8
+ prose-hr:my-8 prose-hr:border-gray-200
+ prose-code:text-gray-800 prose-code:bg-gray-100 prose-code:px-1 prose-code:py-0.5 prose-code:rounded prose-code:text-sm
+ prose-pre:bg-gray-900 prose-pre:text-gray-100 prose-pre:p-4 prose-pre:rounded-lg prose-pre:overflow-x-auto prose-pre:my-6
+ prose-pre:shadow-md prose-pre:text-sm
+ dark:prose-invert dark:prose-pre:bg-gray-800 dark:prose-code:bg-gray-800 dark:prose-blockquote:bg-gray-800"
+>
+ <slot />
+</div>