FieldSeparator
Source: client/lib/theme/vueda-tailwind/shell/index.js
The positioned wrapper for a labelled field divider. It reserves the line height and variant-specific vertical offset used inside field groups.
Vue component: FieldSeparator
| Slot | Default classes | Description |
|---|---|---|
| root | relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2 | The positioned wrapper for a labelled field divider. It reserves the line height and variant-specific vertical offset used inside field groups. |
| line | absolute inset-0 top-1/2 | The horizontal rule behind a field separator label. It fills the separator wrapper and aligns through the vertical center. |
| content | bg-background text-muted-foreground relative mx-auto block w-fit px-2 | The label content laid over the separator line. It uses the page background as a mask so the text remains readable over the rule. |
root
The positioned wrapper for a labelled field divider. It reserves the line height and variant-specific vertical offset used inside field groups.
Default classes:
relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2
Source: client/lib/theme/vueda-tailwind/shell/FieldSeparator.theme.js:18
line
The horizontal rule behind a field separator label. It fills the separator wrapper and aligns through the vertical center.
Default classes:
absolute inset-0 top-1/2
Source: client/lib/theme/vueda-tailwind/shell/FieldSeparator.theme.js:24
content
The label content laid over the separator line. It uses the page background as a mask so the text remains readable over the rule.
Default classes:
bg-background text-muted-foreground relative mx-auto block w-fit px-2
Source: client/lib/theme/vueda-tailwind/shell/FieldSeparator.theme.js:30