aljaz/boris
1
1
Fork 0
mirror of https://github.com/dergigi/boris.git synced 2026-01-22 16:24:30 +01:00
Code Issues Packages Projects Releases Wiki Activity

style(tts): reduce button and text sizes for compact layout

Browse Source
This commit is contained in:
Gigi
2025-10-20 21:59:31 +02:00
parent 31987010b8
commit c623dc8d84
1 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/TTSControls.tsx
View File

@@ -41,9 +41,10 @@ const TTSControls: React.FC<Props> = ({ text, defaultLang, className }) => {
onClick={handlePlayPause}
title={playLabel}
disabled={!canPlay}
style={{ padding: '0.25rem 0.5rem', fontSize: '0.85rem' }}
>
<FontAwesomeIcon icon={!speaking ? faPlay : (paused ? faPlay : faPause)} />
<span style={{ marginLeft: 6 }}>{playLabel}</span>
<span style={{ marginLeft: 4, fontSize: '0.8rem' }}>{playLabel}</span>
</button>
<button
type="button"
@@ -51,16 +52,17 @@ const TTSControls: React.FC<Props> = ({ text, defaultLang, className }) => {
onClick={stop}
title="Stop"
disabled={!speaking && !paused}
style={{ padding: '0.25rem 0.5rem', fontSize: '0.85rem' }}
>
<FontAwesomeIcon icon={faStop} />
<span style={{ marginLeft: 6 }}>Stop</span>
<span style={{ marginLeft: 4, fontSize: '0.8rem' }}>Stop</span>
</button>
<label style={{ display: 'inline-flex', alignItems: 'center', gap: 6, color: '#aaa', fontSize: 12 }}>
<label style={{ display: 'inline-flex', alignItems: 'center', gap: 4, color: '#aaa', fontSize: '0.8rem' }}>
Speed
<select
value={rate}
onChange={e => setRate(Number(e.target.value))}
style={{ background: 'transparent', color: 'inherit', border: '1px solid #444', borderRadius: 4, padding: '2px 6px' }}
style={{ background: 'transparent', color: 'inherit', border: '1px solid #444', borderRadius: 3, padding: '2px 4px', fontSize: '0.75rem' }}
>
<option value={0.8}>0.8x</option>
<option value={1}>1x</option>