NikitolProject/miniperplx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Improve dropdown menu styling and responsiveness

Browse Source
This commit is contained in:
zaidmukaddam 2024-08-15 20:29:24 +05:30
parent 8941291d90
commit a70f15a7b2
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
app/page.tsx
View File

@ -239,13 +239,13 @@ export default function Home() {
disabled={isDisabled} disabled={isDisabled}
onClick={handleToggle} onClick={handleToggle}
> >
{selectedModel === 'Speed' && <FastForward className="w-5 h-5 mr-2" />} {selectedModel === 'Speed' && <FastForward className="w-5 h-5 sm:mr-2" />}
{selectedModel.includes('Quality') && <Sparkles className="w-5 h-5 mr-2" />} {selectedModel.includes('Quality') && <Sparkles className="w-5 h-5 sm:mr-2" />}
{selectedModel} <span className="hidden sm:inline">{selectedModel}</span>
<ChevronDown className={`w-5 h-5 ml-2 transform transition-transform ${isOpen ? 'rotate-180' : ''}`} /> <ChevronDown className={`w-5 h-5 ml-2 transform transition-transform ${isOpen ? 'rotate-180' : ''}`} />
</Button> </Button>
</DropdownMenuTrigger> </DropdownMenuTrigger>
<DropdownMenuContent className="w-64 p-1"> <DropdownMenuContent className="w-64 p-1 mr-2 sm:mr-0">
{models.map((model) => ( {models.map((model) => (
<DropdownMenuItem <DropdownMenuItem
key={model.name} key={model.name}
@ -899,7 +899,7 @@ export default function Home() {
animate={{ opacity: 1, scale: 1 }} animate={{ opacity: 1, scale: 1 }}
transition={{ duration: 0.5, delay: 0.2 }} transition={{ duration: 0.5, delay: 0.2 }}
> >
<User2 className="w-6 h-6 text-primary flex-shrink-0" /> <User2 className="size-5 sm:size-6 text-primary flex-shrink-0" />
</motion.div> </motion.div>
<motion.div <motion.div
initial={{ opacity: 0, y: 20 }} initial={{ opacity: 0, y: 20 }}