PulseApp/docs
PulseApp/docs
1
0
Fork 0
Code Issues Pull Requests 6 Actions Packages Activity

make the doc footer buttons look better

Browse Source 
Took 8 minutes
This commit is contained in:
Braydon 2024-10-06 20:42:35 -04:00
parent c93f11b710
commit a5bdce4ea6
2 changed files with 17 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/docs-footer.tsx
View File

@ -22,27 +22,36 @@ const DocsFooter = ({
current < pages.length - 1 ? pages[current + 1] : undefined; current < pages.length - 1 ? pages[current + 1] : undefined;
return ( return (
<footer className="xs:mx-5 sm:mx-10 my-5 flex flex-col select-none transition-all transform-gpu"> <footer className="xs:mx-5 sm:mx-10 my-2 flex flex-col select-none transition-all transform-gpu">
<Separator className="mb-4" /> <Separator className="mb-4" />
<div className="flex justify-between"> <div className="flex justify-between">
{/* Previous */}
{previous && ( {previous && (
<Link <Link
className="flex gap-2 items-center hover:opacity-75 transition-all transform-gpu group" className="flex gap-2 items-end hover:opacity-75 transition-all transform-gpu group"
href={`/${previous.slug}` || "#"} href={`/${previous.slug}` || "#"}
draggable={false} draggable={false}
> >
<ChevronLeftIcon className="w-4 h-4 group-hover:-translate-x-0.5 transition-all transform-gpu" /> <ChevronLeftIcon className="pb-1 w-4 h-4 group-hover:-translate-x-0.5 transition-all transform-gpu" />
{previous.title} <div className="flex flex-col">
<h1 className="text-sm opacity-75">Previous</h1>
<p>{previous.title}</p>
</div>
</Link> </Link>
)} )}
{/* Next */}
{next && ( {next && (
<Link <Link
className="ml-auto flex gap-2 items-center hover:opacity-75 transition-all transform-gpu group" className="ml-auto flex gap-2 items-end hover:opacity-75 transition-all transform-gpu group"
href={`/${next.slug}` || "#"} href={`/${next.slug}` || "#"}
draggable={false} draggable={false}
> >
{next.title} <div className="flex flex-col">
<ChevronRightIcon className="w-4 h-4 group-hover:translate-x-0.5 transition-all transform-gpu" /> <h1 className="text-sm opacity-75">Next</h1>
<p>{next.title}</p>
</div>
<ChevronRightIcon className="pb-1 w-4 h-4 group-hover:translate-x-0.5 transition-all transform-gpu" />
</Link> </Link>
)} )}
</div> </div>

2
src/components/sidebar/sidebar.tsx
View File

@ -22,7 +22,7 @@ const Sidebar = (): ReactElement => (
</div> </div>
{/* Desktop */} {/* Desktop */}
<div className="hidden fixed top-[4.3rem] inset-y-0 min-w-32 w-40 sm:w-52 py-3 xs:flex flex-col justify-between transition-all transform-gpu"> <div className="hidden fixed top-[4.3rem] inset-y-0 min-w-32 w-40 sm:w-52 py-5 xs:flex flex-col justify-between transition-all transform-gpu">
<SidebarContent /> <SidebarContent />
</div> </div>
</> </>