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

refactor(website): redesign (#9286)

Browse Source
This commit is contained in:
Noel
2023-03-28 19:02:36 +02:00
committed by GitHub
parent d1ebe4a52c
commit 47da24ff5c
25 changed files with 64 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
apps/website/src/components/Header.tsx
View File

@@ -64,9 +64,9 @@ export default function Header() {
);
return (
<header className="dark:bg-dark-400 dark:border-dark-100 bg-light-600 border-light-800 fixed top-0 left-0 z-20 w-full border-b">
<header className="dark:bg-dark/50 dark:border-dark-100 border-light-900 sticky top-4 z-20 rounded-md border bg-white/50 shadow backdrop-blur-md">
<div className="block h-16 px-6">
<div className="flex h-full flex-row place-content-between place-items-center">
<div className="flex h-full flex-row place-content-between place-items-center gap-8">
<Button
aria-label="Menu"
className="focus:ring-width-2 focus:ring-blurple flex h-6 w-6 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center rounded border-0 bg-transparent p-0 text-sm font-semibold leading-none no-underline outline-0 focus:ring active:translate-y-px lg:hidden"
@@ -74,21 +74,21 @@ export default function Header() {
>
<VscMenu size={24} />
</Button>
<div className="hidden md:flex md:flex-row md:overflow-hidden">{breadcrumbs}</div>
<div className="flex flex-row place-items-center gap-4">
<Button
as="div"
className="dark:bg-dark-800 focus:ring-width-2 focus:ring-blurple rounded bg-white px-4 py-2.5 outline-0 focus:ring"
onClick={() => dialog?.toggle()}
>
<div className="flex flex-row place-items-center gap-4">
<VscSearch size={18} />
<span className="opacity-65">Search...</span>
<div className="md:opacity-65 hidden md:flex md:flex-row md:place-items-center md:gap-2">
<FiCommand size={18} /> K
</div>
<div className="hidden lg:flex lg:flex-row lg:overflow-hidden">{breadcrumbs}</div>
<Button
as="div"
className="dark:bg-dark-800 focus:ring-width-2 focus:ring-blurple w-56 grow rounded bg-white px-4 py-2.5 outline-0 focus:ring sm:grow-0"
onClick={() => dialog?.toggle()}
>
<div className="flex flex-row place-items-center gap-4 md:justify-between">
<VscSearch size={18} />
<span className="opacity-65">Search...</span>
<div className="md:opacity-65 hidden md:flex md:flex-row md:place-items-center md:gap-2">
<FiCommand size={18} /> K
</div>
</Button>
</div>
</Button>
<div className="flex flex-row place-items-center gap-4">
<Button
aria-label="GitHub"
as="a"