Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-23 12:07:46 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Merge pull request #776 from Stremio/fix/player-subtitles-tracks-layout

Browse source 
Player: fix subtitles tracks layout
This commit is contained in:
Tim 2024-12-27 13:25:04 +01:00 committed by GitHub
commit 56d69d856f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 29 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -178,11 +178,15 @@ const SubtitlesMenu = React.memo((props) => {
<div className={styles['variants-list']}>
{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}>
<div className={styles['variant-label']}>
{
languages.label(!track.label.startsWith('http') ? track.label : track.lang)
}
<div className={styles['variant-origin']}>{t(track.origin)}</div>
<div className={styles['info']}>
<div className={styles['variant-label']}>
{
languages.label(!track.label.startsWith('http') ? track.label : track.lang)
}
</div>
<div className={styles['variant-origin']}>
{ t(track.origin) }
</div>
</div>
{
props.selectedSubtitlesTrackId === track.id || props.selectedExtraSubtitlesTrackId === track.id ?

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

@ -42,7 +42,6 @@
.language-label, .variant-label {
flex: 1;
max-height: 2.4em;
font-size: 1.1rem;
color: var(--primary-foreground-color);
}
@ -52,10 +51,6 @@
text-overflow: ellipsis;
}
.variant-label .variant-origin {
color: var(--color-placeholder-text);
}
.icon {
flex: none;
width: 0.5rem;
@ -65,6 +60,26 @@
background-color: var(--secondary-accent-color);
}
}
.variant-option {
height: 4rem;
.info {
flex: 1;
display: flex;
flex-direction: column;
gap: 0.25rem;
.variant-label {
line-height: 1.5rem;
}
.variant-origin {
font-size: 0.9rem;
color: var(--color-placeholder-text);
}
}
}
}
}