From b7fadb350a77049f4996b345d10fbe1a7ba3adce Mon Sep 17 00:00:00 2001
From: iCrawl <buechler.noel@outlook.com>
Date: Tue, 4 Oct 2022 01:02:37 +0200
Subject: [PATCH] fix: sidebar menu styling

---
 packages/website/src/components/SidebarItems.tsx        | 2 +-
 packages/website/src/components/TableOfContentItems.tsx | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/website/src/components/SidebarItems.tsx b/packages/website/src/components/SidebarItems.tsx
index 75aa75d36..1723100e6 100644
--- a/packages/website/src/components/SidebarItems.tsx
+++ b/packages/website/src/components/SidebarItems.tsx
@@ -89,7 +89,7 @@ export function SidebarItems({
 						{groupItems[group].map((member, index) => (
 							<Link key={index} href={member.path} prefetch={false}>
 								<a
-									className={`dark:border-dark-100 border-light-800 focus:ring-width-2 focus:ring-blurple ml-5 flex flex-col rounded border-l p-[5px] pl-6 outline-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 p-[5px] pl-6 outline-0 focus:rounded focus:border-0 focus:ring ${
 										asPathWithoutQueryAndAnchor === member.path
 											? 'bg-blurple text-white'
 											: 'dark:hover:bg-dark-200 dark:active:bg-dark-100 hover:bg-light-700 active:bg-light-800'
diff --git a/packages/website/src/components/TableOfContentItems.tsx b/packages/website/src/components/TableOfContentItems.tsx
index 4337055f8..ac86f5e2d 100644
--- a/packages/website/src/components/TableOfContentItems.tsx
+++ b/packages/website/src/components/TableOfContentItems.tsx
@@ -16,7 +16,7 @@ export function TableOfContentItems({
 					key={prop.name}
 					href={`#${prop.name}`}
 					title={prop.name}
-					className="dark:border-dark-100 border-light-800 dark:hover:bg-dark-200 dark:active:bg-dark-100 hover:bg-light-700 active:bg-light-800 pl-6.5 focus:ring-width-2 focus:ring-blurple ml-[10px] rounded border-l p-[5px] text-sm outline-0 focus:ring"
+					className="dark:border-dark-100 border-light-800 dark:hover:bg-dark-200 dark:active:bg-dark-100 hover:bg-light-700 active:bg-light-800 pl-6.5 focus:ring-width-2 focus:ring-blurple ml-[10px] border-l p-[5px] text-sm outline-0 focus:rounded focus:border-0 focus:ring"
 				>
 					<span className="line-clamp-1">{prop.name}</span>
 				</a>
@@ -40,7 +40,7 @@ export function TableOfContentItems({
 						key={key}
 						href={`#${key}`}
 						title={member.name}
-						className="dark:border-dark-100 border-light-800 dark:hover:bg-dark-200 dark:active:bg-dark-100 hover:bg-light-700 active:bg-light-800 pl-6.5 focus:ring-width-2 focus:ring-blurple ml-[10px] flex flex-row place-items-center gap-2 rounded border-l p-[5px] text-sm outline-0 focus:ring"
+						className="dark:border-dark-100 border-light-800 dark:hover:bg-dark-200 dark:active:bg-dark-100 hover:bg-light-700 active:bg-light-800 pl-6.5 focus:ring-width-2 focus:ring-blurple ml-[10px] flex flex-row place-items-center gap-2 border-l p-[5px] text-sm outline-0 focus:rounded focus:border-0 focus:ring"
 					>
 						<span className="line-clamp-1">{member.name}</span>
 						{member.overloadIndex && member.overloadIndex > 1 ? (