shiyue/PinchChat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: hide non-essential header buttons on mobile (sound, export, theme, language)

Browse Source
This commit is contained in:
Nicolas Varrot
2026-02-13 17:50:49 +00:00
parent 219d487c43
commit ac29646dc8
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/Header.tsx
View File

@@ -61,7 +61,7 @@ export function Header({ status, sessionKey, onToggleSidebar, activeSessionData,
<button <button
onClick={onToggleSound} onClick={onToggleSound}
aria-label={soundEnabled ? t('header.soundOff') : t('header.soundOn')} aria-label={soundEnabled ? t('header.soundOff') : t('header.soundOn')}
className="p-2 rounded-2xl hover:bg-[var(--pc-hover)] text-pc-text-muted hover:text-pc-text transition-colors" className="hidden sm:block p-2 rounded-2xl hover:bg-[var(--pc-hover)] text-pc-text-muted hover:text-pc-text transition-colors"
title={soundEnabled ? t('header.soundOff') : t('header.soundOn')} title={soundEnabled ? t('header.soundOff') : t('header.soundOn')}
> >
{soundEnabled ? <Volume2 size={16} /> : <VolumeOff size={16} />} {soundEnabled ? <Volume2 size={16} /> : <VolumeOff size={16} />}
@@ -71,14 +71,14 @@ export function Header({ status, sessionKey, onToggleSidebar, activeSessionData,
<button <button
onClick={handleExport} onClick={handleExport}
aria-label={t('header.export')} aria-label={t('header.export')}
className="p-2 rounded-2xl hover:bg-[var(--pc-hover)] text-pc-text-muted hover:text-pc-text transition-colors" className="hidden sm:block p-2 rounded-2xl hover:bg-[var(--pc-hover)] text-pc-text-muted hover:text-pc-text transition-colors"
title={t('header.export')} title={t('header.export')}
> >
<Download size={16} /> <Download size={16} />
</button> </button>
)} )}
<ThemeSwitcher /> <span className="hidden sm:contents"><ThemeSwitcher /></span>
<LanguageSelector /> <span className="hidden sm:contents"><LanguageSelector /></span>
{status === 'connected' ? ( {status === 'connected' ? (
<div className="flex items-center gap-2 rounded-2xl border border-pc-border bg-pc-elevated/30 px-3 py-1.5"> <div className="flex items-center gap-2 rounded-2xl border border-pc-border bg-pc-elevated/30 px-3 py-1.5">
<span className="w-2 h-2 rounded-full bg-[var(--pc-accent)] shadow-[0_0_12px_var(--pc-accent-dim)]" /> <span className="w-2 h-2 rounded-full bg-[var(--pc-accent)] shadow-[0_0_12px_var(--pc-accent-dim)]" />