Files
sim/apps/docs/components/docs-layout/page-navigation-arrows.tsx
T
Emir Karabeg ad100fa871 improvement(docs): ui/ux cleanup (#4016)
* improvement(landing, blog): SEO and GEO optimization

* improvement(docs): ui/ux cleanup

* chore(blog): remove unused buildBlogJsonLd export and wordCount schema field

* fix(blog): stack related posts vertically on mobile and fill all suggestion slots

- Add flex-col sm:flex-row and matching border classes to related posts
  nav for consistent mobile stacking with the main blog page
- Remove score > 0 filter in getRelatedPosts so it falls back to recent
  posts when there aren't enough tag matches
- Align description text color with main page cards
2026-04-07 11:05:58 -07:00

43 lines
1.3 KiB
TypeScript

'use client'
import { ChevronLeft, ChevronRight } from 'lucide-react'
import Link from 'next/link'
interface PageNavigationArrowsProps {
previous?: {
url: string
}
next?: {
url: string
}
}
export function PageNavigationArrows({ previous, next }: PageNavigationArrowsProps) {
if (!previous && !next) return null
return (
<div className='flex items-center gap-2'>
{previous && (
<Link
href={previous.url}
className='inline-flex items-center justify-center rounded-[5px] border border-transparent px-2.5 py-2 text-foreground/40 transition-colors duration-200 hover:border-border/40 hover:bg-neutral-100 hover:text-foreground/70 dark:hover:bg-neutral-800'
aria-label='Previous page'
title='Previous page'
>
<ChevronLeft className='h-4 w-4' />
</Link>
)}
{next && (
<Link
href={next.url}
className='inline-flex items-center justify-center rounded-[5px] border border-transparent px-2.5 py-2 text-foreground/40 transition-colors duration-200 hover:border-border/40 hover:bg-neutral-100 hover:text-foreground/70 dark:hover:bg-neutral-800'
aria-label='Next page'
title='Next page'
>
<ChevronRight className='h-4 w-4' />
</Link>
)}
</div>
)
}