garden/src/components/NavSection.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

import type { JSX } from "solid-js";

interface NavSectionProps {
  title: string;
  accent?: "cyan" | "green" | "pink" | "purple" | "red" | "yellow";
  children: JSX.Element;
}

export default function NavSection(props: NavSectionProps) {
  return (
    <section class="nav-section" data-accent={props.accent || "purple"}>
      <div class="nav-section-header">{props.title}</div>
      <div class="nav-section-body">
        {props.children}
      </div>
    </section>
  );
}