Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-21 11:42:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

feat/subtitles-track-label

Browse source
This commit is contained in:
ArtificialSloth 2024-09-22 00:17:06 -04:00
parent 9c0f3bfec4
commit 42ca0550ae
2 changed files with 9 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/routes/Player/SubtitlesMenu/SubtitlesMenu.js
View file

@ -204,7 +204,10 @@ const SubtitlesMenu = React.memo((props) => {
<div className={styles['variants-list']}> <div className={styles['variants-list']}>
{subtitlesTracksForLanguage.map((track, index) => ( {subtitlesTracksForLanguage.map((track, index) => (
<Button key={index} title={track.label} className={classnames(styles['variant-option'], { 'selected': props.selectedSubtitlesTrackId === track.id || props.selectedExtraSubtitlesTrackId === track.id })} data-id={track.id} data-origin={track.origin} data-embedded={track.embedded} onClick={subtitlesTrackOnClick}> <Button key={index} title={track.label} className={classnames(styles['variant-option'], { 'selected': props.selectedSubtitlesTrackId === track.id || props.selectedExtraSubtitlesTrackId === track.id })} data-id={track.id} data-origin={track.origin} data-embedded={track.embedded} onClick={subtitlesTrackOnClick}>
<div className={styles['variant-label']}>{track.origin}</div> <div className={styles['variant-origin']}>
{track.origin}
<div className={styles['variant-label']}>{track.label}</div>
</div>
{ {
props.selectedSubtitlesTrackId === track.id || props.selectedExtraSubtitlesTrackId === track.id ? props.selectedSubtitlesTrackId === track.id || props.selectedExtraSubtitlesTrackId === track.id ?
<div className={styles['icon']} /> <div className={styles['icon']} />

6
src/routes/Player/SubtitlesMenu/styles.less
View file

@ -40,13 +40,17 @@
background-color: var(--overlay-color); background-color: var(--overlay-color);
} }
.language-label, .variant-label { .language-label, .variant-origin {
flex: 1; flex: 1;
max-height: 2.4em; max-height: 2.4em;
font-size: 1.1rem; font-size: 1.1rem;
color: var(--primary-foreground-color); color: var(--primary-foreground-color);
} }
.variant-origin .variant-label {
color: var(--color-placeholder-text);
}
.icon { .icon {
flex: none; flex: none;
width: 0.5rem; width: 0.5rem;