SidebarCard

A bordered card with an uppercase icon title, used for repository page sidebar sections.

Import

import { SidebarCard } from "@gumtree/ui/SidebarCard";

Props

PropTypeDefaultDescription
title*string-Section title displayed in uppercase
iconIconName-Phosphor icon name for the title
childrenComponentChildren-Card body content

Examples

With Icon

A sidebar card with a Phosphor icon in the header.

About

Full-stack web application with i18n, CI, and plugin support.

<SidebarCard title="About" icon="info">
  <p class="text-xs text-[var(--text-secondary)]">
    Full-stack web application with i18n, CI, and plugin support.
  </p>
</SidebarCard>

Without Icon

A simple sidebar card with just a title.

Details

Apache-2.0 · 124 stars · 18 forks

<SidebarCard title="Details">
  <p class="text-xs text-[var(--text-muted)]">Apache-2.0 · 124 stars · 18 forks</p>
</SidebarCard>