style: Update heading tag in NavigationItem component

This commit is contained in:
Gauthier Daniels 2025-04-20 16:48:32 +02:00
parent e2ad0bb5f9
commit c580769829
2 changed files with 3 additions and 8 deletions

View File

@ -3,7 +3,6 @@ import type { JSXElement } from "solid-js";
import { TableOfContents } from "@/partials/TableOfContents"; import { TableOfContents } from "@/partials/TableOfContents";
import { PrevNextLinks } from "@/components/PrevNextLinks"; import { PrevNextLinks } from "@/components/PrevNextLinks";
import { usePageContext } from "vike-solid/usePageContext"; import { usePageContext } from "vike-solid/usePageContext";
import { clientOnly } from "vike-solid/clientOnly";
import { clock } from "solid-heroicons/outline"; import { clock } from "solid-heroicons/outline";
import { navigation } from "@/libs/navigation"; import { navigation } from "@/libs/navigation";
import { Prose } from "@/components/Prose"; import { Prose } from "@/components/Prose";
@ -13,10 +12,6 @@ type DocsLayoutProps = {
children: JSXElement; children: JSXElement;
}; };
// const TableOfContents = clientOnly(() =>
// import("@/partials/TableOfContents").then((m) => m.TableOfContents),
// );
export function DocsLayout(props: DocsLayoutProps) { export function DocsLayout(props: DocsLayoutProps) {
const pageContext = usePageContext(); const pageContext = usePageContext();

View File

@ -26,7 +26,7 @@ function NavigationItem(props: NavigationItemProps) {
return ( return (
<> <>
<h2 <h3
class={clsx( class={clsx(
"font-display font-medium cursor-pointer", "font-display font-medium cursor-pointer",
isOpened() ? "text-violet-600" : "text-slate-900", isOpened() ? "text-violet-600" : "text-slate-900",
@ -56,9 +56,9 @@ function NavigationItem(props: NavigationItemProps) {
<span class="text-slate-400"> ({props.section.links.length})</span> <span class="text-slate-400"> ({props.section.links.length})</span>
</button> </button>
</h2> </h3>
{isOpened() && ( {isOpened() && (
<ul class="!mt-0 ml-2 space-y-1 border-l-2 border-slate-100 lg:mt-4 lg:space-y-2 lg:border-slate-200"> <ul class="!mt-0 ml-2 space-y-1 border-l-2 border-slate-100 lg:mt-4 lg:space-y-2 lg:border-slate-200 mb-2">
<For each={props.section.links}> <For each={props.section.links}>
{(link) => ( {(link) => (
<li class="relative"> <li class="relative">