primary color for active slug in breadcrumb
All checks were successful
Deploy / deploy (ubuntu-latest, 2.44.0) (push) Successful in 53s
All checks were successful
Deploy / deploy (ubuntu-latest, 2.44.0) (push) Successful in 53s
Took 4 minutes
This commit is contained in:
parent
f6bd4a2dcb
commit
c99a21395b
@ -13,6 +13,7 @@ import { capitalizeWords } from "@/lib/string";
|
|||||||
import { Metadata } from "next";
|
import { Metadata } from "next";
|
||||||
import Embed from "@/components/embed";
|
import Embed from "@/components/embed";
|
||||||
import DocsFooter from "@/components/docs-footer";
|
import DocsFooter from "@/components/docs-footer";
|
||||||
|
import { cn } from "@/lib/utils";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* The page to render the documentation markdown content.
|
* The page to render the documentation markdown content.
|
||||||
@ -46,12 +47,16 @@ const DocsPage = async ({
|
|||||||
<BreadcrumbList>
|
<BreadcrumbList>
|
||||||
{splitSlug.map(
|
{splitSlug.map(
|
||||||
(part: string, index: number): ReactElement => {
|
(part: string, index: number): ReactElement => {
|
||||||
|
const active: boolean =
|
||||||
|
index === splitSlug.length - 1;
|
||||||
const slug: string = splitSlug
|
const slug: string = splitSlug
|
||||||
.slice(1, index + 1)
|
.slice(1, index + 1)
|
||||||
.join("/");
|
.join("/");
|
||||||
return (
|
return (
|
||||||
<div className="flex items-center" key={part}>
|
<div className="flex items-center" key={part}>
|
||||||
<BreadcrumbItem>
|
<BreadcrumbItem
|
||||||
|
className={cn(active && "text-primary")}
|
||||||
|
>
|
||||||
<BreadcrumbLink
|
<BreadcrumbLink
|
||||||
href={slug}
|
href={slug}
|
||||||
draggable={false}
|
draggable={false}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user