feat: added primary togglegroup buttton styles

This commit is contained in:
Csongor Czezar
2025-12-31 16:26:27 -08:00
parent 5d94466d40
commit dbf4a4c64c
4 changed files with 60 additions and 26 deletions

View File

@@ -4,22 +4,15 @@
<ToggleGroup
v-if="hasLabels"
type="single"
variant="primary"
:model-value="toggleGroupValue"
class="ml-auto gap-0 bg-node-component-surface mb-[-0.5rem]"
class="w-full mb-[-0.5rem]"
@update:model-value="handleToggleGroupChange"
>
<ToggleGroupItem
value="off"
:aria-label="`${widget.name}: ${labelOff}`"
class="rounded-l-md rounded-r-none border-0 bg-node-component-border/10 text-node-component-text data-[state=on]:!bg-white data-[state=on]:!text-black hover:bg-node-component-border/20 cursor-pointer h-7"
>
<ToggleGroupItem value="off" :aria-label="`${widget.name}: ${labelOff}`">
{{ labelOff }}
</ToggleGroupItem>
<ToggleGroupItem
value="on"
:aria-label="`${widget.name}: ${labelOn}`"
class="rounded-l-none rounded-r-md border-0 bg-node-component-border/10 text-node-component-text data-[state=on]:!bg-white data-[state=on]:!text-black hover:bg-node-component-border/20 cursor-pointer h-7"
>
<ToggleGroupItem value="on" :aria-label="`${widget.name}: ${labelOn}`">
{{ labelOn }}
</ToggleGroupItem>
</ToggleGroup>