aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authorAndrew Lee <alee14498@protonmail.com>2024-01-25 20:09:56 -0500
committerAndrew Lee <alee14498@protonmail.com>2024-01-25 20:09:56 -0500
commited2c9768a0471d11a0b87a5514dcbf387ebbf8f7 (patch)
tree3ffd02b87699b8e5b2a48ebbd8c9df16466f8f3e /src
parent162e303beeb5f2987852b543805fb6243a4ae725 (diff)
downloadpersonal-website-ed2c9768a0471d11a0b87a5514dcbf387ebbf8f7.tar.gz
personal-website-ed2c9768a0471d11a0b87a5514dcbf387ebbf8f7.tar.bz2
personal-website-ed2c9768a0471d11a0b87a5514dcbf387ebbf8f7.zip
Markdown cb style; Fixed chrome-only issue; Format date on blog
Diffstat (limited to 'src')
-rw-r--r--src/layouts/BlogPost.astro3
-rw-r--r--src/layouts/Default.astro8
-rw-r--r--src/pages/blog/[...slug].astro3
-rw-r--r--src/util.ts8
4 files changed, 19 insertions, 3 deletions
diff --git a/src/layouts/BlogPost.astro b/src/layouts/BlogPost.astro
index 60baee6..15b3cfd 100644
--- a/src/layouts/BlogPost.astro
+++ b/src/layouts/BlogPost.astro
@@ -1,12 +1,13 @@
---
import Layout from './Default.astro';
-const { title, description } = Astro.props;
+const { title, description, date } = Astro.props;
---
<Layout title=`${title} - Andrew Lee` description={description}>
<header>
<h1 class="header-text">{title}</h1>
<h2 class="header-text">{description}</h2>
+ <small>{date}</small>
</header>
<div class="container">
<main>
diff --git a/src/layouts/Default.astro b/src/layouts/Default.astro
index b2e383b..d3b7548 100644
--- a/src/layouts/Default.astro
+++ b/src/layouts/Default.astro
@@ -38,7 +38,7 @@ import Navbar from '../components/Navbar.vue';
</head>
<body>
<Navbar client:load />
- <div transition:name="initial">
+ <div transition:animate="fade">
<slot />
<footer>
<p>Made with {Astro.generator} and Hosted on Vercel</p>
@@ -56,6 +56,12 @@ import Navbar from '../components/Navbar.vue';
color: #FFFFFF;
}
+ @media screen and (-webkit-min-device-pixel-ratio:0) {
+ html {
+ scrollbar-gutter: stable;
+ }
+ }
+
ul {
padding-left: 20px;
font-size: 1.1em;
diff --git a/src/pages/blog/[...slug].astro b/src/pages/blog/[...slug].astro
index 7db75bb..de4efb6 100644
--- a/src/pages/blog/[...slug].astro
+++ b/src/pages/blog/[...slug].astro
@@ -1,6 +1,7 @@
---
import Page from '../../layouts/BlogPost.astro';
import { getEntry } from 'astro:content';
+import { formatDate } from "../../util";
const { slug } = Astro.params;
if (slug === undefined) {
@@ -15,7 +16,7 @@ if(entry === undefined) {
const { Content } = await entry.render();
---
-<Page title={entry.data.title} description={entry.data.description}>
+<Page title={entry.data.title} description={entry.data.description} date={formatDate(entry.data.date)}>
<main>
<Content />
</main>
diff --git a/src/util.ts b/src/util.ts
new file mode 100644
index 0000000..f7f9018
--- /dev/null
+++ b/src/util.ts
@@ -0,0 +1,8 @@
+// Format date to a string
+function formatDate(date: Date): string {
+ const options: Intl.DateTimeFormatOptions = { year: 'numeric', month: 'long', day: 'numeric' };
+
+ return new Date(date).toLocaleDateString(undefined, options);
+}
+
+export { formatDate }