fix(enums): dark theme colors

This commit is contained in:
iCrawl
2022-07-25 01:38:17 +02:00
parent 4fff6076e7
commit 5a3c9996e0
2 changed files with 17 additions and 10 deletions

View File

@@ -10,8 +10,8 @@ export interface EnumProps {
export function Enum({ data }: EnumProps) {
return (
<DocContainer name={data.name} kind={data.kind} excerpt={data.excerpt} summary={data.summary}>
<Section title="Members">
<div className="flex flex-col space-y-5">
<Section title="Members" className="dark:text-white">
<div className="flex flex-col gap-5">
{data.members.map((member) => (
<CodeListing
key={member.name}

View File

@@ -7,16 +7,21 @@ import vercelLogo from '../assets/powered-by-vercel.svg';
import text from '../text.json';
interface ButtonProps {
title: string;
label: string;
href?: string;
ref?: Ref<HTMLAnchorElement>;
onClick?: MouseEventHandler<HTMLAnchorElement>;
}
// eslint-disable-next-line react/display-name
const LinkButton = forwardRef<HTMLAnchorElement, ButtonProps>(({ title, onClick, href }: ButtonProps, ref) => (
<a href={href} onClick={onClick} ref={ref} className="max-h-[70px] bg-blurple px-3 py-4 rounded-lg">
<p className="font-semibold text-white m-0">{title}</p>
const LinkButton = forwardRef<HTMLAnchorElement, ButtonProps>(({ label, onClick, href }: ButtonProps, ref) => (
<a
href={href}
onClick={onClick}
ref={ref}
className="no-underline max-h-[70px] bg-blurple px-3 py-4 rounded-lg font-semibold text-white"
>
{label}
</a>
));
@@ -29,7 +34,9 @@ export default function IndexRoute() {
<Image className="h-[50px] w-[50px]" src={logo} />
</div>
<div className="flex flex-row space-x-8">
<a className="text-blurple font-semibold">Docs</a>
<Link href="/docs" passHref>
<a className="no-underline text-blurple font-semibold">Docs</a>
</Link>
<a className="text-blurple font-semibold">Guide</a>
</div>
</div>
@@ -40,9 +47,9 @@ export default function IndexRoute() {
<h1 className="font-bold text-6xl text-blurple my-2">{text.heroTitle}</h1>
<p className="text-xl text-dark-100 dark:text-gray-300">{text.heroDescription}</p>
<div className="flex flew-row space-x-4">
<LinkButton title="Read the guide" />
<Link href="/docs/" passHref>
<LinkButton title="Check out the docs" />
<LinkButton label="Read the guide" />
<Link href="/docs" passHref>
<LinkButton label="Check out the docs" />
</Link>
</div>
</div>