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

feat: reintroduce outline navigation

Browse Source
This commit is contained in:
iCrawl
2023-11-13 18:03:23 +01:00
parent 7c935dc84b
commit bc8f83368a
21 changed files with 130 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/guide/src/components/Nav.tsx
View File

@@ -23,7 +23,9 @@ export function Nav() {
)}
universal
>
<Sidebar />
<div className="flex flex-col gap-4 p-3">
<Sidebar />
</div>
</Scrollbars>
</nav>
);

4
apps/guide/src/components/Sidebar.tsx
View File

@@ -32,7 +32,7 @@ export function Sidebar() {
const { setOpened } = useNav();
return (
<div className="flex flex-col gap-3 p-3">
<div className="flex flex-col gap-4">
{Object.keys(itemsByCategory).map((category, idx) => (
<Section
buttonClassName="bg-light-600 hover:bg-light-700 active:bg-light-800 dark:bg-dark-400 dark:hover:bg-dark-300 dark:active:bg-dark-400 focus:ring-width-2 focus:ring-blurple rounded p-3 outline-none focus:ring z-10"
@@ -41,7 +41,7 @@ export function Sidebar() {
>
{itemsByCategory[category]?.map((member, index) => (
<Link
className={`dark:border-dark-100 border-light-800 focus:ring-width-2 focus:ring-blurple ml-5 flex flex-col border-l p-[5px] pl-6 outline-none focus:rounded focus:border-0 focus:ring ${
className={`dark:border-dark-100 border-light-800 focus:ring-width-2 focus:ring-blurple ml-5 flex flex-col border-l first:mt-1 p-[5px] pl-6 outline-none focus:rounded focus:border-0 focus:ring ${
decodeURIComponent(pathname ?? '') === member.href
? 'bg-blurple text-white'
: 'dark:hover:bg-dark-200 dark:active:bg-dark-100 hover:bg-light-700 active:bg-light-800'