fixing desktop mode top bar

This commit is contained in:
2025-10-06 11:19:01 +02:00
parent 71e01488dc
commit a113294acf

View File

@ -639,7 +639,7 @@ function App() {
</div>
{/* Desktop header */}
<div className="hidden lg:flex items-center gap-6">
<div className="hidden lg:flex items-center gap-4">
<h1
onClick={() => setShowHelp(true)}
className="font-mono text-sm tracking-[0.3em] text-white flex-shrink-0 cursor-pointer hover:opacity-70 transition-opacity"
@ -654,36 +654,36 @@ function App() {
getMappedLFOs={getMappedLFOs}
/>
</div>
<div className="flex gap-4 flex-shrink-0">
<div className="flex gap-3 flex-shrink-0">
<button
onClick={handleStop}
disabled={!playing}
className="px-2 lg:px-6 py-1 lg:py-2 bg-black text-white border-2 border-white font-mono text-[9px] lg:text-[11px] tracking-[0.2em] hover:bg-white hover:text-black transition-all disabled:opacity-30 disabled:cursor-not-allowed flex items-center gap-1 lg:gap-2"
className="px-4 py-2 bg-black text-white border-2 border-white font-mono text-[10px] tracking-[0.2em] hover:bg-white hover:text-black transition-all disabled:opacity-30 disabled:cursor-not-allowed flex items-center gap-1"
>
<Square size={12} strokeWidth={2} fill="currentColor" className="lg:w-[14px] lg:h-[14px]" />
<span className="hidden sm:inline">STOP</span>
<Square size={12} strokeWidth={2} fill="currentColor" />
STOP
</button>
<button
onClick={handleRandom}
className="px-2 lg:px-6 py-1 lg:py-2 bg-white text-black font-mono text-[9px] lg:text-[11px] tracking-[0.2em] hover:bg-black hover:text-white border-2 border-white transition-all flex items-center gap-1 lg:gap-2"
className="px-4 py-2 bg-white text-black font-mono text-[10px] tracking-[0.2em] hover:bg-black hover:text-white border-2 border-white transition-all flex items-center gap-1"
>
<Dices size={12} strokeWidth={2} className="lg:w-[14px] lg:h-[14px]" />
<span className="hidden sm:inline">RANDOM</span>
<Dices size={12} strokeWidth={2} />
RANDOM
</button>
<button
onClick={handleRandomizeAllParams}
className="px-2 lg:px-6 py-1 lg:py-2 bg-white text-black font-mono text-[9px] lg:text-[11px] tracking-[0.2em] hover:bg-black hover:text-white border-2 border-white transition-all flex items-center gap-1 lg:gap-2"
className="px-4 py-2 bg-white text-black font-mono text-[10px] tracking-[0.2em] hover:bg-black hover:text-white border-2 border-white transition-all flex items-center gap-1"
>
<Sparkles size={12} strokeWidth={2} className="lg:w-[14px] lg:h-[14px]" />
<span className="hidden sm:inline">CHAOS</span>
<Sparkles size={12} strokeWidth={2} />
CHAOS
</button>
<button
onClick={handleDownloadAll}
disabled={downloading}
className="px-2 lg:px-6 py-1 lg:py-2 bg-black text-white border-2 border-white font-mono text-[9px] lg:text-[11px] tracking-[0.2em] hover:bg-white hover:text-black transition-all disabled:opacity-30 disabled:cursor-not-allowed flex items-center gap-1 lg:gap-2"
className="px-4 py-2 bg-black text-white border-2 border-white font-mono text-[10px] tracking-[0.2em] hover:bg-white hover:text-black transition-all disabled:opacity-30 disabled:cursor-not-allowed flex items-center gap-1"
>
<Archive size={12} strokeWidth={2} className="lg:w-[14px] lg:h-[14px]" />
<span className="hidden sm:inline">{downloading ? 'DOWNLOADING...' : 'PACK'}</span>
<Archive size={12} strokeWidth={2} />
{downloading ? 'DOWNLOADING...' : 'PACK'}
</button>
</div>
</div>