@public-ui/components
Version:
Contains all web components that belong to KoliBri - The accessible HTML-Standard.
34 lines (18 loc) • 2.23 kB
Markdown
# kol-card
<!-- Auto Generated Below -->
## Overview
The **Card** component is ideal for visually highlighting individual sections of your website. It allows you to structure your content very easily.
The **Card** component consists of a **_title area_** and a **_content area_**.
The **title area** is displayed in a larger font. The **content area** is visually separated from the title area by a horizontal dividing line and is rendered in the default font.
## Properties
| Property | Attribute | Description | Type | Default |
| --------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------- | ----------- |
| `_hasCloser` | `_has-closer` | Defines whether the element can be closed. | `boolean \| undefined` | `false` |
| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` |
| `_level` | `_level` | Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text. | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| undefined` | `0` |
| `_on` | -- | Defines the event callback functions for the component. | `undefined \| { onClose?: EventCallback<Event> \| undefined; }` | `undefined` |
## Slots
| Slot | Description |
| ---- | ----------------------------------------------------------------------- |
| | Allows arbitrary HTML to be inserted into the content area of the card. |
----------------------------------------------