Settings tweaks

This commit is contained in:
Gavin McDonald
2025-07-03 14:31:32 -04:00
parent ed6fef5ef1
commit 97b6b66bad
5 changed files with 27 additions and 21 deletions

View File

@@ -1,7 +1,7 @@
'use client';
import { useState } from 'react';
import { Settings as Gear } from 'lucide-react';
import { CircleX, Settings as Gear } from 'lucide-react';
import { Cinzel_Decorative } from 'next/font/google';
import { useAppContext } from '@/app/AppContext';
@@ -31,12 +31,12 @@ export default function Settings() {
<div
className={`
fixed top-4 right-4
flex flex-col items-center justify-evenly
flex flex-col items-center justify-between
bg-slate-800 text-yellow-400
rounded-lg border border-yellow-400
h-full py-3 px-4
h-full p-8
transition-all duration-250
${open ? `opacity-100 ${isDM ? 'w-[350px] max-h-[375px]' : 'w-[300px] max-h-[175px]'}` : 'opacity-0 w-0 max-h-0'}
${open ? `opacity-100 ${isDM ? 'w-[350px] max-h-[425px]' : 'w-[325px] max-h-[200px]'}` : 'opacity-0 w-0 max-h-0'}
`}
>
<GameLinks />
@@ -44,9 +44,15 @@ export default function Settings() {
<CardStyle />
<ExternalLinks />
</div>
<button
className={`fixed top-4 right-4 p-2 transition-all duration-250 text-yellow-400 hover:text-yellow-300 hover:drop-shadow-[0_0_3px_#ffd700] cursor-pointer`}
onClick={() => setOpen((prev) => !prev)}
>
<CircleX className="w-5 h-5" />
</button>
</Scrim>
<button
className={`p-2 transition-all duration-250 text-yellow-400 hover:text-yellow-300 hover:drop-shadow-[0_0_3px_#ffd700] cursor-pointer ${open ? 'pointer-events-none opacity-0' : 'pointer-events-auto opacity-100'}`}
className={`p-2 transition-all duration-250 text-yellow-400 hover:text-yellow-300 hover:drop-shadow-[0_0_3px_#ffd700] cursor-pointer`}
onClick={() => setOpen((prev) => !prev)}
>
<Gear className="w-5 h-5" />