Fixes for few tags and categories pages
This commit is contained in:
parent
77b1916df1
commit
c61bcd3a41
5 changed files with 47 additions and 57 deletions
|
|
@ -52,33 +52,28 @@ export default async function CategoryPage({ params }: CategoryPageProps) {
|
||||||
<main className="max-w-3xl 2xl:max-w-4xl mx-auto px-4 py-8 mb-8 lg:py-16 w-full">
|
<main className="max-w-3xl 2xl:max-w-4xl mx-auto px-4 py-8 mb-8 lg:py-16 w-full">
|
||||||
<div className="font-mono text-sm text-fg-dim mb-2">~/categories/{categorySlug}</div>
|
<div className="font-mono text-sm text-fg-dim mb-2">~/categories/{categorySlug}</div>
|
||||||
|
|
||||||
<div className="border-l border-border ml-1 mb-3">
|
<ul className="border-l border-border ml-1 mb-3">
|
||||||
<span className="py-2 px-5 block font-bold group-hover:text-accent transition-colors capitalize">
|
{posts.map((post) => (
|
||||||
{category}
|
<li key={post.slug} className="pl-5">
|
||||||
</span>
|
<Link
|
||||||
<ul className="border-l border-border ml-8 mb-3">
|
href={`/posts/${post.slug}`}
|
||||||
{posts.map((post) => (
|
className="group flex items-baseline justify-between gap-3 py-1.5 px-2 -ml-2 border-l-2 border-transparent hover:bg-accent/10 hover:border-accent transition-colors"
|
||||||
<li key={post.slug} className="pl-5">
|
>
|
||||||
<Link
|
<span className="group-hover:text-accent transition-colors truncate">
|
||||||
href={`/posts/${post.slug}`}
|
{post.title}
|
||||||
className="group flex items-baseline justify-between gap-3 py-1.5 px-2 -ml-2 border-l-2 border-transparent hover:bg-accent/10 hover:border-accent transition-colors"
|
</span>
|
||||||
>
|
{post.date && (
|
||||||
<span className="group-hover:text-accent transition-colors truncate">
|
<time
|
||||||
{post.title}
|
dateTime={new Date(post.date).toISOString()}
|
||||||
</span>
|
className="text-sm whitespace-nowrap"
|
||||||
{post.date && (
|
>
|
||||||
<time
|
{dateFormatter.format(new Date(post.date))}
|
||||||
dateTime={new Date(post.date).toISOString()}
|
</time>
|
||||||
className="text-sm whitespace-nowrap"
|
)}
|
||||||
>
|
</Link>
|
||||||
{dateFormatter.format(new Date(post.date))}
|
</li>
|
||||||
</time>
|
))}
|
||||||
)}
|
</ul>
|
||||||
</Link>
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</main>
|
</main>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -30,7 +30,7 @@ export async function generateMetadata(): Promise<Metadata> {
|
||||||
export default function CategoriesPage() {
|
export default function CategoriesPage() {
|
||||||
const categories = getAllCategories()
|
const categories = getAllCategories()
|
||||||
const posts = getAllPostsMeta()
|
const posts = getAllPostsMeta()
|
||||||
const categoryNames = Object.keys(categories)
|
const categoryNames = Object.keys(categories).toSorted((a, b) => a.localeCompare(b))
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<main className="max-w-3xl 2xl:max-w-4xl mx-auto px-4 py-8 mb-8 lg:py-16 w-full">
|
<main className="max-w-3xl 2xl:max-w-4xl mx-auto px-4 py-8 mb-8 lg:py-16 w-full">
|
||||||
|
|
|
||||||
|
|
@ -52,33 +52,28 @@ export default async function TagPage({ params }: TagPageProps) {
|
||||||
<main className="max-w-3xl 2xl:max-w-4xl mx-auto px-4 py-8 mb-8 lg:py-16 w-full">
|
<main className="max-w-3xl 2xl:max-w-4xl mx-auto px-4 py-8 mb-8 lg:py-16 w-full">
|
||||||
<div className="font-mono text-sm text-fg-dim mb-2">~/tags/{tagSlug}</div>
|
<div className="font-mono text-sm text-fg-dim mb-2">~/tags/{tagSlug}</div>
|
||||||
|
|
||||||
<div className="border-l border-border ml-1 mb-3">
|
<ul className="border-l border-border ml-1 mb-3">
|
||||||
<span className="py-2 px-5 block font-bold group-hover:text-accent transition-colors capitalize">
|
{posts.map((post) => (
|
||||||
{tag}
|
<li key={post.slug} className="pl-5">
|
||||||
</span>
|
<Link
|
||||||
<ul className="border-l border-border ml-8 mb-3">
|
href={`/posts/${post.slug}`}
|
||||||
{posts.map((post) => (
|
className="group flex items-baseline justify-between gap-3 py-1.5 px-2 -ml-2 border-l-2 border-transparent hover:bg-accent/10 hover:border-accent transition-colors"
|
||||||
<li key={post.slug} className="pl-5">
|
>
|
||||||
<Link
|
<span className="group-hover:text-accent transition-colors truncate">
|
||||||
href={`/posts/${post.slug}`}
|
{post.title}
|
||||||
className="group flex items-baseline justify-between gap-3 py-1.5 px-2 -ml-2 border-l-2 border-transparent hover:bg-accent/10 hover:border-accent transition-colors"
|
</span>
|
||||||
>
|
{post.date && (
|
||||||
<span className="group-hover:text-accent transition-colors truncate">
|
<time
|
||||||
{post.title}
|
dateTime={new Date(post.date).toISOString()}
|
||||||
</span>
|
className="text-sm whitespace-nowrap"
|
||||||
{post.date && (
|
>
|
||||||
<time
|
{dateFormatter.format(new Date(post.date))}
|
||||||
dateTime={new Date(post.date).toISOString()}
|
</time>
|
||||||
className="text-sm whitespace-nowrap"
|
)}
|
||||||
>
|
</Link>
|
||||||
{dateFormatter.format(new Date(post.date))}
|
</li>
|
||||||
</time>
|
))}
|
||||||
)}
|
</ul>
|
||||||
</Link>
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</main>
|
</main>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -30,7 +30,7 @@ export async function generateMetadata(): Promise<Metadata> {
|
||||||
export default function TagsPage() {
|
export default function TagsPage() {
|
||||||
const tags = getAllTags()
|
const tags = getAllTags()
|
||||||
const posts = getAllPostsMeta()
|
const posts = getAllPostsMeta()
|
||||||
const tagNames = Object.keys(tags)
|
const tagNames = Object.keys(tags).toSorted((a, b) => a.localeCompare(b))
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<main className="max-w-3xl 2xl:max-w-4xl mx-auto px-4 py-8 mb-8 lg:py-16 w-full">
|
<main className="max-w-3xl 2xl:max-w-4xl mx-auto px-4 py-8 mb-8 lg:py-16 w-full">
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
title: "Vigilare: A Local-First Productivity Dashboard"
|
title: "Vigilare: A Local-First Productivity Dashboard"
|
||||||
description: Introducing Vigilare, a local-first, customizable productivity dashboard built with Next.js. Designed for developers and technical users, Vigilare offers a distraction-free way to manage links, notes, commands, and service status without logins or cloud dependencies.
|
description: Introducing Vigilare, a local-first, customizable productivity dashboard built with Next.js. Designed for developers and technical users, Vigilare offers a distraction-free way to manage links, notes, commands, and service status without logins or cloud dependencies.
|
||||||
date: 2026-02-07 14:00:00 +0200
|
date: 2026-02-07 14:00:00 +0200
|
||||||
categories: [Productivity, Tech]
|
category: Productivity
|
||||||
tags: [vigilare, dashboard, productivity, browser, organization, focus]
|
tags: [vigilare, dashboard, productivity, browser, organization, focus]
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue