From 70da3746f880d0b83f04ea0485850f49f7945a62 Mon Sep 17 00:00:00 2001
From: iCrawl <buechler.noel@outlook.com>
Date: Thu, 13 Apr 2023 20:56:44 +0200
Subject: [PATCH] fix(website): static badge and overload switcher

---
 apps/website/src/components/OverloadSwitcher.tsx |  2 +-
 apps/website/src/components/Property.tsx         | 16 +++++++++++++---
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/apps/website/src/components/OverloadSwitcher.tsx b/apps/website/src/components/OverloadSwitcher.tsx
index c7bc283a2..cff7a3b53 100644
--- a/apps/website/src/components/OverloadSwitcher.tsx
+++ b/apps/website/src/components/OverloadSwitcher.tsx
@@ -32,7 +32,7 @@ export default function OverloadSwitcher({ overloads, children }: PropsWithChild
 	return (
 		<div className="flex flex-col place-items-start gap-2">
 			<MenuButton
-				className="rounded bg-light-700 p-3 outline-0 active:bg-light-800 dark:bg-dark-600 hover:bg-light-800 focus:ring focus:ring-width-2 focus:ring-blurple dark:active:bg-dark-400 dark:hover:bg-dark-500"
+				className="mb-2 rounded bg-white p-3 outline-0 active:bg-light-900 dark:bg-dark-400 hover:bg-light-800 focus:ring focus:ring-width-2 focus:ring-blurple md:-ml-2 dark:active:bg-dark-200 dark:hover:bg-dark-300"
 				state={menu}
 			>
 				<div className="flex flex-row place-content-between place-items-center gap-2">
diff --git a/apps/website/src/components/Property.tsx b/apps/website/src/components/Property.tsx
index 556b45640..db1a01563 100644
--- a/apps/website/src/components/Property.tsx
+++ b/apps/website/src/components/Property.tsx
@@ -1,4 +1,9 @@
-import type { ApiDeclaredItem, ApiItemContainerMixin, ApiPropertyItem } from '@microsoft/api-extractor-model';
+import type {
+	ApiDeclaredItem,
+	ApiItemContainerMixin,
+	ApiProperty,
+	ApiPropertySignature,
+} from '@microsoft/api-extractor-model';
 import type { PropsWithChildren } from 'react';
 import { Anchor } from './Anchor';
 import { ExcerptText } from './ExcerptText';
@@ -17,7 +22,7 @@ export function Property({
 	inheritedFrom,
 }: PropsWithChildren<{
 	inheritedFrom?: (ApiDeclaredItem & ApiItemContainerMixin) | undefined;
-	item: ApiPropertyItem;
+	item: ApiProperty | ApiPropertySignature;
 	separator?: PropertySeparatorType;
 }>) {
 	const isDeprecated = Boolean(item.tsdocComment?.deprecatedBlock);
@@ -26,7 +31,7 @@ export function Property({
 	return (
 		<div className="flex flex-col scroll-mt-30 gap-4" id={item.displayName}>
 			<div className="flex flex-col gap-2 md:-ml-9">
-				{isDeprecated || item.isReadonly || item.isOptional ? (
+				{isDeprecated || item.isReadonly || item.isOptional || (item as ApiProperty).isStatic ? (
 					<div className="flex flex-row gap-1 md:ml-7">
 						{isDeprecated ? (
 							<div className="h-5 flex flex-row place-content-center place-items-center rounded-full bg-red-500 px-3 text-center text-xs font-semibold uppercase text-white">
@@ -43,6 +48,11 @@ export function Property({
 								Optional
 							</div>
 						) : null}
+						{(item as ApiProperty).isStatic ? (
+							<div className="h-5 flex flex-row place-content-center place-items-center rounded-full bg-blurple px-3 text-center text-xs font-semibold uppercase text-white">
+								Static
+							</div>
+						) : null}
 					</div>
 				) : null}
 				<div className="flex flex-row flex-wrap place-items-center gap-1">