item-size dropped from videos list

This commit is contained in:
nklhrstv 2020-03-30 12:26:43 +03:00
parent 7141443c6a
commit 7844348d97
3 changed files with 21 additions and 29 deletions

View file

@ -31,11 +31,11 @@ const VideosList = ({ className, metaResource }) => {
<React.Fragment>
<SeasonsBar.Placeholder className={styles['seasons-bar']} />
<div className={styles['videos-scroll-container']}>
<Video.Placeholder className={styles['video']} />
<Video.Placeholder className={styles['video']} />
<Video.Placeholder className={styles['video']} />
<Video.Placeholder className={styles['video']} />
<Video.Placeholder className={styles['video']} />
<Video.Placeholder />
<Video.Placeholder />
<Video.Placeholder />
<Video.Placeholder />
<Video.Placeholder />
</div>
</React.Fragment>
:
@ -68,21 +68,19 @@ const VideosList = ({ className, metaResource }) => {
<Icon className={styles['icon']} icon={'ic_search'} />
</label>
<div className={styles['videos-scroll-container']}>
{videosForSeason
.filter((video) => {
return search.length === 0 ||
(
(typeof video.title === 'string' && video.title.toLowerCase().includes(search.toLowerCase())) ||
(video.released.toLocaleString(undefined, { year: '2-digit', month: 'short', day: 'numeric' }).toLowerCase().includes(search.toLowerCase()))
);
})
.map((video, index) => (
<Video
{...video}
key={index}
className={styles['video']}
/>
))}
{
videosForSeason
.filter((video) => {
return search.length === 0 ||
(
(typeof video.title === 'string' && video.title.toLowerCase().includes(search.toLowerCase())) ||
(video.released.toLocaleString(undefined, { year: '2-digit', month: 'short', day: 'numeric' }).toLowerCase().includes(search.toLowerCase()))
);
})
.map((video, index) => (
<Video {...video} key={index} />
))
}
</div>
</React.Fragment>
}

View file

@ -6,10 +6,10 @@
.message-container {
flex: 1;
align-self: stretch;
display: flex;
flex-direction: column;
align-items: center;
width: var(--item-size);
padding: 2rem;
overflow-y: auto;
@ -35,7 +35,6 @@
.seasons-bar {
flex: none;
align-self: stretch;
min-width: var(--item-size);
}
.search-bar-container {
@ -45,7 +44,6 @@
flex-direction: row;
align-items: center;
height: 3.5rem;
min-width: calc(var(--item-size) - 3rem);
padding: 0 1rem;
margin: 0 1.5rem 1rem 1.5rem;
border-radius: 3.5rem;
@ -88,10 +86,7 @@
.videos-scroll-container {
flex: 1;
align-self: stretch;
overflow-y: auto;
.video {
width: var(--item-size);
}
}
}

View file

@ -89,8 +89,7 @@
}
.videos-list, .streams-list {
--item-size: 26.5rem;
flex: none;
flex: 0 0 26.5rem;
align-self: stretch;
background-color: @color-background-dark5-70;
}