vignesh/trypost
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Make the language and font dropdowns match their trigger width

Browse source 
The PopoverContent used w-[--reka-popover-trigger-width], which Tailwind v4
compiles to the invalid `width: --reka-popover-trigger-width`, so the dropdown
collapsed to its content width. Use the v4 CSS-variable syntax
w-(--reka-popover-trigger-width) so it resolves to var(...) and spans the full
trigger width, matching the SearchableSelect component.
This commit is contained in:
Paulo Castellano 2026-07-03 19:01:16 -03:00
parent c9209cb2a9
commit 5a96bb490a
2 changed files with 2 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
resources/js/components/FontPicker.vue
View file

@ -91,7 +91,7 @@ const select = (font: string) => {
</Button>
</PopoverTrigger>
<PopoverContent class="w-[--reka-popover-trigger-width] p-0" align="start">
<PopoverContent class="w-(--reka-popover-trigger-width) p-0" align="start">
<Command>
<CommandInput :placeholder="searchPlaceholder" />
<CommandList>

2
resources/js/components/LanguagePicker.vue
View file

@ -53,7 +53,7 @@ const select = (code: string) => {
</Button>
</PopoverTrigger>
<PopoverContent class="w-[--reka-popover-trigger-width] p-0" align="start">
<PopoverContent class="w-(--reka-popover-trigger-width) p-0" align="start">
<Command>
<CommandInput :placeholder="searchPlaceholder" />
<CommandList>