starred/tuxmate
1
0
Fork 0
mirror of https://github.com/abusoww/tuxmate.git synced 2026-04-17 21:53:12 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: prevent command bar text wrapping on narrow screens

Browse Source
This commit is contained in:
NIJAT
2025-12-29 00:12:48 +04:00
parent b0bd27341a
commit f83293afe2
2 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/command/CommandFooter.tsx
View File

@@ -231,10 +231,10 @@ export function CommandFooter({
className={`flex items-center gap-2 px-4 py-3 border-r border-[var(--border-primary)]/30 transition-all shrink-0 bg-indigo-500/10 text-indigo-400 hover:bg-indigo-500/20 hover:text-indigo-300 ${selectedCount === 0 ? 'opacity-50 cursor-not-allowed' : ''}`}
title="Toggle Preview (Tab)"
>
<ChevronUp className="w-3.5 h-3.5" />
<span className="font-bold">PREVIEW</span>
<ChevronUp className="w-3.5 h-3.5 shrink-0" />
<span className="font-bold whitespace-nowrap">PREVIEW</span>
{selectedCount > 0 && (
<span className="text-[10px] opacity-60 ml-0.5">[{selectedCount}]</span>
<span className="text-[10px] opacity-60 ml-0.5 whitespace-nowrap">[{selectedCount}]</span>
)}
</button>
@@ -260,8 +260,8 @@ export function CommandFooter({
}`}
title="Download Script (d)"
>
<Download className="w-3 h-3" />
<span className="hidden sm:inline">Download</span>
<Download className="w-3 h-3 shrink-0" />
<span className="hidden sm:inline whitespace-nowrap">Download</span>
</button>
{/* Tab: Copy (highlighted) */}
@@ -276,8 +276,8 @@ export function CommandFooter({
}`}
title="Copy Command (y)"
>
{copied ? <Check className="w-3 h-3" /> : <Copy className="w-3 h-3" />}
<span className="hidden sm:inline">{copied ? 'Copied!' : 'Copy'}</span>
{copied ? <Check className="w-3 h-3 shrink-0" /> : <Copy className="w-3 h-3 shrink-0" />}
<span className="hidden sm:inline whitespace-nowrap">{copied ? 'Copied!' : 'Copy'}</span>
</button>
</div>
</div>

8
src/components/command/ShortcutsBar.tsx
View File

@@ -50,7 +50,7 @@ export const ShortcutsBar = forwardRef<HTMLInputElement, ShortcutsBarProps>(
{/* LEFT SECTION */}
<div className="flex items-stretch">
{/* Mode Badge - like nvim NORMAL/INSERT */}
<div className="bg-[var(--text-primary)] text-[var(--bg-primary)] px-3 py-1 font-bold flex items-center">
<div className="bg-[var(--text-primary)] text-[var(--bg-primary)] px-3 py-1 font-bold flex items-center whitespace-nowrap">
{distroName.toUpperCase()}
</div>
@@ -84,7 +84,7 @@ export const ShortcutsBar = forwardRef<HTMLInputElement, ShortcutsBarProps>(
{/* App count */}
{selectedCount > 0 && (
<div className="flex items-center px-3 py-1 text-[var(--text-muted)] border-r border-[var(--border-primary)]/30">
<div className="flex items-center px-3 py-1 text-[var(--text-muted)] border-r border-[var(--border-primary)]/30 whitespace-nowrap">
[{selectedCount} app{selectedCount !== 1 ? 's' : ''}]
</div>
)}
@@ -94,14 +94,14 @@ export const ShortcutsBar = forwardRef<HTMLInputElement, ShortcutsBarProps>(
<div className="flex items-stretch border-r border-[var(--border-primary)]/30">
<button
onClick={() => setSelectedHelper('yay')}
className={`px-3 flex items-center gap-2 text-[10px] font-medium transition-colors border-r border-[var(--border-primary)]/30 ${selectedHelper === 'yay' ? 'bg-[var(--text-primary)] text-[var(--bg-primary)] font-bold' : 'text-[var(--text-muted)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-secondary)]'}`}
className={`px-3 flex items-center gap-2 text-[10px] font-medium transition-colors border-r border-[var(--border-primary)]/30 whitespace-nowrap ${selectedHelper === 'yay' ? 'bg-[var(--text-primary)] text-[var(--bg-primary)] font-bold' : 'text-[var(--text-muted)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-secondary)]'}`}
>
<span className="font-mono opacity-70">1</span>
yay
</button>
<button
onClick={() => setSelectedHelper('paru')}
className={`px-3 flex items-center gap-2 text-[10px] font-medium transition-colors ${selectedHelper === 'paru' ? 'bg-[var(--text-primary)] text-[var(--bg-primary)] font-bold' : 'text-[var(--text-muted)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-secondary)]'}`}
className={`px-3 flex items-center gap-2 text-[10px] font-medium transition-colors whitespace-nowrap ${selectedHelper === 'paru' ? 'bg-[var(--text-primary)] text-[var(--bg-primary)] font-bold' : 'text-[var(--text-muted)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-secondary)]'}`}
>
<span className="font-mono opacity-70">2</span>
paru