Nomchy/discord.js
1
0
Fork 0
mirror of https://github.com/discordjs/discord.js.git synced 2026-03-14 18:43:31 +01:00
Code Issues Packages Projects Releases Wiki Activity

refactor(website): consolidate styling for buttons (#9466)

Browse Source
This commit is contained in:
Suneet Tipirneni
2023-04-28 15:42:47 -04:00
committed by GitHub
parent 217e5d8100
commit 988f8c7546
7 changed files with 54 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
apps/website/src/app/docs/packages/[package]/page.tsx
View File

@@ -3,6 +3,7 @@ import { VscArrowRight } from '@react-icons/all-files/vsc/VscArrowRight';
import { VscVersions } from '@react-icons/all-files/vsc/VscVersions';
import Link from 'next/link';
import { notFound } from 'next/navigation';
import { buttonVariants } from '~/styles/Button';
import { PACKAGES } from '~/util/constants';
export const runtime = 'edge';
@@ -31,7 +32,7 @@ export default async function Page({ params }: { params: { package: string } })
<div className="flex flex-col gap-4">
{data.map((version, idx) => (
<Link
className="h-11 flex flex-col transform-gpu cursor-pointer select-none appearance-none place-content-center border border-neutral-300 rounded bg-white p-4 text-base font-semibold leading-none text-black outline-none active:translate-y-px dark:border-dark-100 active:bg-neutral-200 dark:bg-dark-400 hover:bg-neutral-100 dark:text-white focus:ring focus:ring-width-2 focus:ring-blurple dark:active:bg-dark-200 dark:hover:bg-dark-300"
className={buttonVariants({ variant: 'secondary' })}
href={`/docs/packages/${params.package}/${version}`}
key={`${version}-${idx}`}
>
@@ -45,10 +46,7 @@ export default async function Page({ params }: { params: { package: string } })
</Link>
)) ?? null}
</div>
<Link
className="h-11 flex flex-row transform-gpu cursor-pointer select-none appearance-none place-items-center place-self-center gap-2 border-0 rounded bg-blurple px-4 text-base font-semibold leading-none text-white no-underline outline-none active:translate-y-px focus:ring focus:ring-width-2 focus:ring-white"
href="/docs/packages"
>
<Link className={buttonVariants({ className: 'place-self-center' })} href="/docs/packages">
<VscArrowLeft size={20} /> Go back
</Link>
</div>

13
apps/website/src/app/docs/packages/page.tsx
View File

@@ -3,6 +3,7 @@ import { VscArrowLeft } from '@react-icons/all-files/vsc/VscArrowLeft';
import { VscArrowRight } from '@react-icons/all-files/vsc/VscArrowRight';
import { VscPackage } from '@react-icons/all-files/vsc/VscPackage';
import Link from 'next/link';
import { buttonVariants } from '~/styles/Button';
import { PACKAGES } from '~/util/constants';
export const runtime = 'edge';
@@ -28,7 +29,7 @@ export default function Page() {
</a>
{PACKAGES.map((pkg, idx) => (
<Link
className="h-11 flex flex-row transform-gpu cursor-pointer select-none appearance-none place-content-between border border-neutral-300 rounded bg-white p-4 text-base font-semibold leading-none text-black outline-none active:translate-y-px dark:border-dark-100 active:bg-neutral-200 dark:bg-dark-400 hover:bg-neutral-100 dark:text-white focus:ring focus:ring-width-2 focus:ring-blurple dark:active:bg-dark-200 dark:hover:bg-dark-300"
className={buttonVariants({ variant: 'secondary' })}
href={`/docs/packages/${pkg}`}
key={`${pkg}-${idx}`}
>
@@ -51,10 +52,7 @@ export default function Page() {
</div>
</Link>
))}
<a
className="h-11 flex transform-gpu cursor-pointer select-none appearance-none place-content-between border border-neutral-300 rounded bg-white p-4 text-base font-semibold leading-none text-black outline-none active:translate-y-px dark:border-dark-100 active:bg-neutral-200 dark:bg-dark-400 hover:bg-neutral-100 dark:text-white focus:ring focus:ring-width-2 focus:ring-blurple dark:active:bg-dark-200 dark:hover:bg-dark-300"
href="https://discord-api-types.dev/"
>
<a className={buttonVariants({ variant: 'secondary' })} href="https://discord-api-types.dev/">
<div className="flex grow flex-row place-content-between place-items-center gap-4">
<div className="flex grow flex-row place-content-between place-items-center gap-4">
<div className="flex flex-row place-content-between place-items-center gap-4">
@@ -66,10 +64,7 @@ export default function Page() {
</div>
</a>
</div>
<Link
className="h-11 flex flex-row transform-gpu cursor-pointer select-none appearance-none place-items-center place-self-center gap-2 border-0 rounded bg-blurple px-4 text-base font-semibold leading-none text-white no-underline outline-none active:translate-y-px focus:ring focus:ring-width-2 focus:ring-white"
href="/"
>
<Link className={buttonVariants({ className: 'place-self-center' })} href="/">
<VscArrowLeft size={20} /> Go back
</Link>
</div>