feat: enhance blog functionality with markdown rendering and bundling

- Updated build process to bundle main and blog scripts separately using esbuild.
- Modified HTML files to reference new bundled JavaScript files for improved performance.
- Implemented a new blogPage.js script to handle markdown rendering and copy functionality.
- Replaced inline markdown rendering with JSON payloads for better separation of content and presentation.
- Added Prism.js for syntax highlighting in blog posts.
- Improved CSS styles for better layout and scrolling behavior on blog pages.
This commit is contained in:
2026-05-10 19:53:19 +10:00
parent 35b049b833
commit a16445dd78
9 changed files with 192 additions and 309 deletions

View File

@@ -8,7 +8,16 @@
<link rel="canonical" href="https://lit.ruv.wtf/blog/testddd/">
<link rel="icon" type="image/png" sizes="32x32" href="/logos/32px.png">
<link rel="icon" type="image/png" sizes="64x64" href="/logos/64px.png">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-tomorrow.min.css">
<link rel="stylesheet" href="/styles/main.css">
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/prism.min.js"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-javascript.min.js"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-python.min.js"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-typescript.min.js"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-jsx.min.js"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-css.min.js"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-json.min.js"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-bash.min.js"></script>
</head>
<body class="blog-page">
<nav class="quick-links" aria-label="Primary">
@@ -28,11 +37,10 @@
<p class="blog-post-meta"><span>May 10, 2026</span><span aria-hidden="true">-</span><span>it me</span></p>
</header>
<section class="blog-post-content"><p class="md-p">asdffdsaasdffdsa</p>
<p class="md-p">| &lt;br /&gt; | &lt;br /&gt; | &lt;br /&gt; | &lt;br /&gt; |<br />| :----- | :----- | :----- | -----: |<br />| &lt;br /&gt; | &lt;br /&gt; | &lt;br /&gt; | &lt;br /&gt; |<br />| &lt;br /&gt; | &lt;br /&gt; | &lt;br /&gt; | &lt;br /&gt; |</p>
<p class="md-p">&lt;br /&gt;</p>
<p class="md-p">this is a test post, should&#39;t publish i guess, but who&#39;s reading lmao</p></section>
<section class="blog-post-content" data-blog-post-content></section>
<script id="blogPostMarkdown" type="application/json">"asdffdsaasdffdsa\n\n| <br /> | <br /> | <br /> | <br /> |\n| :----- | :----- | :----- | -----: |\n| <br /> | <br /> | <br /> | <br /> |\n| <br /> | <br /> | <br /> | <br /> |\n\n<br />\n\nthis is a test post, should't publish i guess, but who's reading lmao\n"</script>
</article>
</main>
<script type="module" src="/scripts/blogPage.js"></script>
</body>
</html>