From 8a3970e7831b3ca41b4f7f62142e212b3f3af072 Mon Sep 17 00:00:00 2001 From: Sindre Kjelsrud Date: Sun, 17 Mar 2024 14:58:49 +0100 Subject: [PATCH] :lipstick: update blogpost ui Signed-off-by: Sindre Kjelsrud --- src/components/BlogContainer.astro | 21 +++++++++++++++++++++ src/components/BlogHeader.astro | 29 +++++++++++++++++++++++++++++ src/layouts/BlogPost.astro | 6 +++--- 3 files changed, 53 insertions(+), 3 deletions(-) create mode 100644 src/components/BlogContainer.astro create mode 100644 src/components/BlogHeader.astro diff --git a/src/components/BlogContainer.astro b/src/components/BlogContainer.astro new file mode 100644 index 0000000..c3c1647 --- /dev/null +++ b/src/components/BlogContainer.astro @@ -0,0 +1,21 @@ +--- +import BaseHead from '../components/BaseHead.astro'; +import BlogHeader from '../components/BlogHeader.astro'; +import Footer from '../components/Footer.astro'; +import { SITE_TITLE, SITE_DESCRIPTION } from '../consts'; +--- + + + + + + + +
+
+ + +
+
+ + diff --git a/src/components/BlogHeader.astro b/src/components/BlogHeader.astro new file mode 100644 index 0000000..b2711c3 --- /dev/null +++ b/src/components/BlogHeader.astro @@ -0,0 +1,29 @@ +--- +import ThemeIcon from './ThemeIcon.astro'; + +function toggleTheme() { + const currentTheme = document.body.getAttribute('data-theme'); + document.body.setAttribute('data-theme', currentTheme === 'dark' ? 'light' : 'dark'); +} +--- + +
+
+ + + +
+ +
+ + diff --git a/src/layouts/BlogPost.astro b/src/layouts/BlogPost.astro index 2b594dc..5a41d48 100644 --- a/src/layouts/BlogPost.astro +++ b/src/layouts/BlogPost.astro @@ -1,7 +1,7 @@ --- import type { CollectionEntry } from 'astro:content'; import FormattedDate from '../components/FormattedDate.astro'; -import SectionContainer from '../components/SectionContainer.astro'; +import BlogContainer from '../components/BlogContainer.astro'; type Props = CollectionEntry<'blog'>['data']; @@ -23,7 +23,7 @@ const { title, description, pubDate } = Astro.props; } - +

{title}

@@ -37,4 +37,4 @@ const { title, description, pubDate } = Astro.props;
-
+