fix: dropwdown component styles (#411)

openlitedotdev · Oct 15, 2024 · ce0af66 · ce0af66
1 parent eaee7b1
commit ce0af66
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 5 deletions.
diff --git a/docs/content/docs/components/dropdown.mdx b/docs/content/docs/components/dropdown.mdx
@@ -24,10 +24,12 @@ description: A dropdown is a toggleable that allows the user to choose one valu
 ## Usage
 
 <Dropdown className="w-96" >
- <DropdownTrigger asChild>
- <Button variant="outline">Open</Button>
- </DropdownTrigger>
- <DropdownContent className="max-h-72">
+ <div className='flex justify-center'>
+ <DropdownTrigger asChild>
+ <Button>Open</Button>
+ </DropdownTrigger>
+ </div>
+ <DropdownContent>
  <DropdownLabel>My Account</DropdownLabel>
  <DropdownSeparator />
  <DropdownGroup>

diff --git a/src/plugins/components/dropdown.ts b/src/plugins/components/dropdown.ts
@@ -106,7 +106,7 @@ export const dropdownSubContent = cva('z-50 min-w-[8rem] rounded-medium shadow-m
  * // accordion elements
  * </DropdownContent>
  */
-export const dropdownContent = cva('z-50 min-w-[8rem] border border-default-300 p-3 overflow-hidden rounded-medium data-[state=open]:animate-dropdown-in data-[state=closed]:animate-dropdown-out shadow-md data-[side=top]:slide-in-from-bottom-2 data-[side=right]:slide-in-from-left-2 data-[side=bottom]:slide-in-from-top-2')
+export const dropdownContent = cva('z-50 min-w-56 border border-default-300 p-3 bg-background overflow-hidden rounded-medium data-[state=open]:animate-dropdown-in data-[state=closed]:animate-dropdown-out shadow-md data-[side=top]:slide-in-from-bottom-2 data-[side=right]:slide-in-from-left-2 data-[side=bottom]:slide-in-from-top-2')
 
 /**
  * Dropdown Item **Class Variants** component