diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json index d23a4456c..45f9fd78d 100644 --- a/src/i18n/locales/en.json +++ b/src/i18n/locales/en.json @@ -540,6 +540,8 @@ "lyricOffset": "lyrics offset (ms)", "lyricGap": "lyric gap", "lyricSize": "lyric size", + "lyricOpacityNonActive": "non-active lyric opacity", + "lyricScaleNonActive": "non-active lyric scale", "opacity": "opacity", "showLyricMatch": "show lyric match", "showLyricProvider": "show lyric provider", diff --git a/src/renderer/features/lyrics/components/lyrics-settings-form.tsx b/src/renderer/features/lyrics/components/lyrics-settings-form.tsx index 7cada3cb2..a7a42d70f 100644 --- a/src/renderer/features/lyrics/components/lyrics-settings-form.tsx +++ b/src/renderer/features/lyrics/components/lyrics-settings-form.tsx @@ -17,6 +17,7 @@ import { MultiSelect } from '/@/shared/components/multi-select/multi-select'; import { NumberInput } from '/@/shared/components/number-input/number-input'; import { SegmentedControl } from '/@/shared/components/segmented-control/segmented-control'; import { Select } from '/@/shared/components/select/select'; +import { Slider } from '/@/shared/components/slider/slider'; import { Stack } from '/@/shared/components/stack/stack'; import { Switch } from '/@/shared/components/switch/switch'; import { TextInput } from '/@/shared/components/text-input/text-input'; @@ -185,6 +186,48 @@ export const LyricsSettingsForm = ({ settingsKey }: LyricsSettingsFormProps) => postProcess: 'sentenceCase', }), }, + { + control: ( + (e * 100).toFixed(0) + '%'} + max={1.0} + min={0.0} + onChangeEnd={(e) => { + updateDisplaySetting({ + opacityNonActive: e, + }); + }} + step={0.01} + w={100} + /> + ), + description: '', + title: t(`${t('page.fullscreenPlayer.config.lyricOpacityNonActive')}`, { + postProcess: 'sentenceCase', + }), + }, + { + control: ( + (e * 100).toFixed(0) + '%'} + max={1.0} + min={0.5} + onChangeEnd={(e) => { + updateDisplaySetting({ + scaleNonActive: e, + }); + }} + step={0.01} + w={100} + /> + ), + description: '', + title: t(`${t('page.fullscreenPlayer.config.lyricScaleNonActive')}`, { + postProcess: 'sentenceCase', + }), + }, { control: ( {settings.showProvider && source && ( ()( state.lyrics = mainSettings; state.lyricsDisplay = { - default: displaySettings, + default: { + ...state.lyricsDisplay.default, + ...displaySettings, + }, }; } }