Include stylesheet in static file generation

This commit is contained in:
thiloho
2024-08-17 20:21:23 +02:00
parent f3278fb1f6
commit dc9a2eabe9
5 changed files with 36 additions and 4 deletions

View File

@@ -100,6 +100,7 @@ in
User = cfg.user; User = cfg.user;
Group = cfg.group; Group = cfg.group;
Restart = "always"; Restart = "always";
WorkingDirectory = "${cfg.package}/web-app";
}; };
script = '' script = ''

View File

@@ -14,6 +14,7 @@
<svelte:head> <svelte:head>
<head> <head>
<title>{title}</title> <title>{title}</title>
<link rel="stylesheet" href="../styles.css" />
</head> </head>
</svelte:head> </svelte:head>
@@ -28,7 +29,9 @@
</nav> </nav>
<header> <header>
{#if coverImage}
<img src={coverImage} alt="" /> <img src={coverImage} alt="" />
{/if}
<h1>{title}</h1> <h1>{title}</h1>
<p>{publicationDate}</p> <p>{publicationDate}</p>
</header> </header>

View File

@@ -12,6 +12,7 @@
<svelte:head> <svelte:head>
<head> <head>
<title>{title}</title> <title>{title}</title>
<link rel="stylesheet" href="./styles.css" />
</head> </head>
</svelte:head> </svelte:head>
@@ -45,7 +46,9 @@
<h3> <h3>
<a href="./articles/{articleFileName}.html">{article.title}</a> <a href="./articles/{articleFileName}.html">{article.title}</a>
</h3> </h3>
<p>{article.meta_description ?? "No description provided"}</p> {#if article.meta_description}
<p>{article.meta_description}</p>
{/if}
</article> </article>
{/each} {/each}
</section> </section>

View File

@@ -0,0 +1,18 @@
:root {
color-scheme: light dark;
}
body {
margin-inline: auto;
inline-size: min(100% - 2rem, 75ch);
line-height: 1.5;
font-family: system-ui, sans-serif;
}
img,
picture,
svg,
video {
max-inline-size: 100%;
block-size: auto;
}

View File

@@ -1,4 +1,4 @@
import { mkdir, writeFile } from "node:fs/promises"; import { readFile, mkdir, writeFile } from "node:fs/promises";
import { join } from "node:path"; import { join } from "node:path";
import { md } from "$lib/utils"; import { md } from "$lib/utils";
import type { Actions, PageServerLoad } from "./$types"; import type { Actions, PageServerLoad } from "./$types";
@@ -85,7 +85,9 @@ const generateStaticFiles = async (websiteData: any, isPreview: boolean = true)
title: article.title, title: article.title,
logoType: websiteData.logo_type, logoType: websiteData.logo_type,
logo: websiteData.logo_text, logo: websiteData.logo_text,
coverImage: `${API_BASE_PREFIX}/rpc/retrieve_file?id=${article.cover_image}`, coverImage: article.cover_image
? `${API_BASE_PREFIX}/rpc/retrieve_file?id=${article.cover_image}`
: "",
publicationDate: article.publication_date, publicationDate: article.publication_date,
mainContent: md.render(article.main_content ?? ""), mainContent: md.render(article.main_content ?? ""),
footerAdditionalText: websiteData.additional_text ?? "" footerAdditionalText: websiteData.additional_text ?? ""
@@ -96,4 +98,9 @@ const generateStaticFiles = async (websiteData: any, isPreview: boolean = true)
await writeFile(join(uploadDir, "articles", `${articleFileName}.html`), articleFileContents); await writeFile(join(uploadDir, "articles", `${articleFileName}.html`), articleFileContents);
} }
const styles = await readFile(`${process.cwd()}/src/lib/templates/blog/styles.css`, {
encoding: "utf-8"
});
await writeFile(join(uploadDir, "styles.css"), styles);
}; };