mirror of
https://github.com/discordjs/discord.js.git
synced 2026-03-09 16:13:31 +01:00
fix: sidebar tab icon (#11141)
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
import { DocsLayout } from 'fumadocs-ui/layouts/docs';
|
import { DocsLayout } from 'fumadocs-ui/layouts/docs';
|
||||||
import type { ReactNode } from 'react';
|
import type { CSSProperties, ReactNode } from 'react';
|
||||||
import { baseOptions } from '@/app/layout.config';
|
import { baseOptions } from '@/app/layout.config';
|
||||||
import { source } from '@/lib/source';
|
import { source } from '@/lib/source';
|
||||||
|
|
||||||
@@ -13,17 +13,18 @@ export default function Layout({ children }: { readonly children: ReactNode }) {
|
|||||||
if (!meta || !node.icon) return option;
|
if (!meta || !node.icon) return option;
|
||||||
|
|
||||||
// category selection color based on path src/styles/base.css
|
// category selection color based on path src/styles/base.css
|
||||||
const color = `var(--${meta.file.path.split('/')[0]}-color, var(--color-fd-foreground))`;
|
const color = `var(--${meta.path.split('/')[0]}-color, var(--color-fd-foreground))`;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
...option,
|
...option,
|
||||||
icon: (
|
icon: (
|
||||||
<div
|
<div
|
||||||
className="rounded-lg border p-1.5 shadow-lg md:mb-auto md:rounded-md md:p-1 [&_svg]:size-6 md:[&_svg]:size-5"
|
className="size-full rounded-lg text-(--tab-color) max-md:border max-md:bg-(--tab-color)/10 max-md:p-1.5 [&_svg]:size-full"
|
||||||
style={{
|
style={
|
||||||
color,
|
{
|
||||||
backgroundColor: `color-mix(in oklab, ${color} 10%, transparent)`,
|
'--tab-color': color,
|
||||||
}}
|
} as CSSProperties
|
||||||
|
}
|
||||||
>
|
>
|
||||||
{node.icon}
|
{node.icon}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user