itlxrd/psysonic
1
0
Fork 0
mirror of https://github.com/kilyabin/psysonic.git synced 2026-07-22 06:25:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(albums): align year filter inputs to button height and font size

Browse Source 
Input padding and font-size now match adjacent .btn elements so the
year filter row no longer has mixed heights.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Psychotoxical
2026-04-09 13:23:14 +02:00
parent 0da92c2fa1
commit 48d0145dc8
1 changed files with 5 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/Albums.tsx
+5 -6
View File
@@ -218,7 +218,7 @@ export default function Albums() {
))} ))}
<div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}> <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>
<span style={{ fontSize: 12, color: 'var(--text-muted)', whiteSpace: 'nowrap' }}> <span style={{ fontSize: 14, color: 'var(--text-muted)', whiteSpace: 'nowrap' }}>
{t('albums.yearFilterLabel')} {t('albums.yearFilterLabel')}
</span> </span>
<input <input
@@ -229,9 +229,9 @@ export default function Albums() {
placeholder={t('albums.yearFrom')} placeholder={t('albums.yearFrom')}
value={yearFrom} value={yearFrom}
onChange={e => setYearFrom(e.target.value)} onChange={e => setYearFrom(e.target.value)}
style={{ width: 68, padding: '4px 6px', fontSize: 12 }} style={{ width: 76, padding: 'var(--space-2) var(--space-2)' }}
/> />
<span style={{ fontSize: 12, color: 'var(--text-muted)' }}>–</span> <span style={{ fontSize: 14, color: 'var(--text-muted)' }}>–</span>
<input <input
className="input" className="input"
type="number" type="number"
@@ -240,16 +240,15 @@ export default function Albums() {
placeholder={t('albums.yearTo')} placeholder={t('albums.yearTo')}
value={yearTo} value={yearTo}
onChange={e => setYearTo(e.target.value)} onChange={e => setYearTo(e.target.value)}
style={{ width: 68, padding: '4px 6px', fontSize: 12 }} style={{ width: 76, padding: 'var(--space-2) var(--space-2)' }}
/> />
{yearActive && ( {yearActive && (
<button <button
className="btn btn-ghost" className="btn btn-ghost"
onClick={clearYear} onClick={clearYear}
data-tooltip={t('albums.yearFilterClear')} data-tooltip={t('albums.yearFilterClear')}
style={{ padding: '4px 6px' }}
> >
<X size={13} /> <X size={14} />
</button> </button>
)} )}
</div> </div>