Mirrors/movie-web
2
0
Fork 0
mirror of https://github.com/movie-web/movie-web.git synced 2024-11-13 08:35:08 +01:00
Code Issues Packages Projects Releases Wiki Activity

caption settings reorganize

Browse Source 
Co-authored-by: Jip Frijlink <JipFr@users.noreply.github.com>
This commit is contained in:
mrjvs 2023-10-23 21:06:31 +02:00
parent a2968d3bf8
commit 109d9054d6
2 changed files with 19 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/player/atoms/Settings.tsx
View File

@ -51,7 +51,7 @@ function SettingsOverlay({ id }: { id: string }) {
<CaptionsView id={id} />
</Menu.CardWithScrollable>
</OverlayPage>
<OverlayPage id={id} path="/captions/settings" width={343} height={430}>
<OverlayPage id={id} path="/captions/settings" width={343} height={450}>
<Menu.Card>
<CaptionSettingsView id={id} />
</Menu.Card>

35
src/components/player/atoms/settings/CaptionSettingsView.tsx
View File

@ -236,14 +236,16 @@ export function CaptionSettingsView({ id }: { id: string }) {
decimalsAllowed={1}
controlButtons
/>
<CaptionSetting
label="Text size"
max={200}
min={1}
textTransformer={(s) => `${s}%`}
onChange={(v) => updateStyling({ size: v / 100 })}
value={styling.size * 100}
/>
<div className="flex justify-between items-center">
<Menu.FieldTitle>Fix capitalization</Menu.FieldTitle>
<div className="flex justify-center items-center">
<Toggle
enabled={overrideCasing}
onClick={() => setOverrideCasing(!overrideCasing)}
/>
</div>
</div>
<Menu.Divider />
<CaptionSetting
label="Background opacity"
max={100}
@ -252,6 +254,14 @@ export function CaptionSettingsView({ id }: { id: string }) {
value={styling.backgroundOpacity * 100}
textTransformer={(s) => `${s}%`}
/>
<CaptionSetting
label="Text size"
max={200}
min={1}
textTransformer={(s) => `${s}%`}
onChange={(v) => updateStyling({ size: v / 100 })}
value={styling.size * 100}
/>
<div className="flex justify-between items-center">
<Menu.FieldTitle>Color</Menu.FieldTitle>
<div className="flex justify-center items-center">
@ -264,15 +274,6 @@ export function CaptionSettingsView({ id }: { id: string }) {
))}
</div>
</div>
<div className="flex justify-between items-center">
<Menu.FieldTitle>Fix capitalization</Menu.FieldTitle>
<div className="flex justify-center items-center">
<Toggle
enabled={overrideCasing}
onClick={() => setOverrideCasing(!overrideCasing)}
/>
</div>
</div>
</Menu.Section>
</>
);