mmintel/klz-cables.com
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

feat: complete wcag accessibility and contrast improvements
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 12s
Details
Build & Deploy / 🧪 QA (push) Successful in 4m40s
Details
Build & Deploy / 🏗️ Build (push) Failing after 31s
Details
Build & Deploy / 🚀 Deploy (push) Has been skipped
Details
Build & Deploy / 🧪 Smoke Test (push) Has been skipped
Details
Build & Deploy / ⚡ Lighthouse (push) Has been skipped
Details
Build & Deploy / 🔔 Notify (push) Successful in 2s
Details

Browse Source
This commit is contained in:
Marc Mintel
2026-02-21 20:43:18 +01:00
parent 678c803408
commit 1153a79eb6
15 changed files with 228 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
app/[locale]/blog/[slug]/page.tsx
View File

@@ -110,10 +110,13 @@ export default async function BlogPost({ params }: BlogPostProps) {
</time>
<span className="w-1 h-1 bg-white/30 rounded-full" />
<span>{getReadingTime(post.content)} min read</span>
{(new Date(post.frontmatter.date) > new Date() || post.frontmatter.public === false) && (
{(new Date(post.frontmatter.date) > new Date() ||
post.frontmatter.public === false) && (
<>
<span className="w-1 h-1 bg-white/30 rounded-full" />
<span className="px-2 py-0.5 border border-white/40 text-white/80 rounded uppercase tracking-widest text-[10px] md:text-xs font-bold">Draft Preview</span>
<span className="px-2 py-0.5 border border-white/40 text-white/80 rounded uppercase tracking-widest text-[10px] md:text-xs font-bold">
Draft Preview
</span>
</>
)}
</div>
@@ -134,7 +137,7 @@ export default async function BlogPost({ params }: BlogPostProps) {
<Heading level={1} className="mb-8">
{post.frontmatter.title}
</Heading>
<div className="flex items-center gap-6 text-text-secondary font-medium">
<div className="flex items-center gap-6 text-text-primary/80 font-medium">
<time dateTime={post.frontmatter.date}>
{new Date(post.frontmatter.date).toLocaleDateString(locale, {
year: 'numeric',
@@ -142,12 +145,15 @@ export default async function BlogPost({ params }: BlogPostProps) {
day: 'numeric',
})}
</time>
<span className="w-1 h-1 bg-neutral-300 rounded-full" />
<span className="w-1 h-1 bg-neutral-400 rounded-full" />
<span>{getReadingTime(post.content)} min read</span>
{(new Date(post.frontmatter.date) > new Date() || post.frontmatter.public === false) && (
{(new Date(post.frontmatter.date) > new Date() ||
post.frontmatter.public === false) && (
<>
<span className="w-1 h-1 bg-neutral-300 rounded-full" />
<span className="px-2 py-0.5 border border-orange-500/50 text-orange-600 rounded uppercase tracking-widest text-[10px] md:text-xs font-bold">Draft Preview</span>
<span className="px-2 py-0.5 border border-orange-500/50 text-orange-600 rounded uppercase tracking-widest text-[10px] md:text-xs font-bold">
Draft Preview
</span>
</>
)}
</div>
@@ -181,7 +187,13 @@ export default async function BlogPost({ params }: BlogPostProps) {
{/* Post Navigation */}
<div className="mt-16">
<PostNavigation prev={prev} next={next} isPrevRandom={isPrevRandom} isNextRandom={isNextRandom} locale={locale} />
<PostNavigation
prev={prev}
next={next}
isPrevRandom={isPrevRandom}
isNextRandom={isNextRandom}
locale={locale}
/>
</div>
{/* Back to blog link */}