Finish base template for blog

This commit is contained in:
thiloho
2024-08-28 17:30:32 +02:00
parent 6a5cf76264
commit 4572b7f6ce
7 changed files with 170 additions and 31 deletions

View File

@@ -2,11 +2,15 @@
const {
logoType,
logo,
isDocsTemplate = false
isDocsTemplate = false,
categorizedArticles = {},
isIndexPage = true
}: {
logoType: "text" | "image";
logo: string;
isDocsTemplate?: boolean;
categorizedArticles?: { [key: string]: { title: string }[] };
isIndexPage?: boolean;
} = $props();
</script>
@@ -30,9 +34,23 @@
</svg>
</label>
<ul class="docs-navigation">
<li>nav comes here</li>
</ul>
<section id="docs-navigation" class="docs-navigation">
<ul>
{#each Object.keys(categorizedArticles) as key}
<li>
<strong>{key}</strong>
<ul>
{#each categorizedArticles[key] as { title }}
{@const articleFileName = title.toLowerCase().split(" ").join("-")}
<li>
<a href="{isIndexPage ? './articles' : '.'}/{articleFileName}.html">{title}</a>
</li>
{/each}
</ul>
</li>
{/each}
</ul>
</section>
{/if}
<a href="../">
{#if logoType === "text"}

View File

@@ -9,6 +9,7 @@
logoType,
logo,
mainContent,
categorizedArticles,
coverImage,
publicationDate,
footerAdditionalText
@@ -18,6 +19,7 @@
logoType: "text" | "image";
logo: string;
mainContent: string;
categorizedArticles: { [key: string]: { title: string }[] };
coverImage: string;
publicationDate: string;
footerAdditionalText: string;
@@ -26,7 +28,7 @@
<Head {title} {favicon} nestingLevel={1} />
<Nav {logoType} {logo} isDocsTemplate={true} />
<Nav {logoType} {logo} isDocsTemplate={true} {categorizedArticles} isIndexPage={false} />
<header>
<div class="container">

View File

@@ -10,6 +10,7 @@
logo,
mainContent,
articles,
categorizedArticles,
footerAdditionalText
}: {
favicon: string;
@@ -18,13 +19,14 @@
logo: string;
mainContent: string;
articles: { title: string; publication_date: string; meta_description: string }[];
categorizedArticles: { [key: string]: { title: string }[] };
footerAdditionalText: string;
} = $props();
</script>
<Head {title} {favicon} />
<Nav {logoType} {logo} isDocsTemplate={true} />
<Nav {logoType} {logo} isDocsTemplate={true} {categorizedArticles} />
<header>
<div class="container">
@@ -35,30 +37,6 @@
<main>
<div class="container">
{@html mainContent}
{#if articles.length > 0}
<section class="articles" id="articles">
<h2>
<a href="#articles">Articles</a>
</h2>
<ul class="unpadded">
{#each articles as article}
{@const articleFileName = article.title.toLowerCase().split(" ").join("-")}
<li>
<p>{article.publication_date}</p>
<p>
<strong>
<a href="./articles/{articleFileName}.html">{article.title}</a>
</strong>
</p>
{#if article.meta_description}
<p>{article.meta_description}</p>
{/if}
</li>
{/each}
</ul>
</section>
{/if}
</div>
</main>