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

items count changed for rows with landscape posters

Browse source
This commit is contained in:
nklhrstv 2020-03-28 20:19:16 +02:00
parent 3d7cc56f9c
commit f45663b04d
2 changed files with 61 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/routes/Search/Search.js
View file

@ -1,5 +1,6 @@
const React = require('react');
const PropTypes = require('prop-types');
const classnames = require('classnames');
const Icon = require('stremio-icons/dom');
const { Image, MainNavBars, MetaRow, MetaItem, useDeepEqualMemo } = require('stremio/common');
const useSearch = require('./useSearch');
@ -51,10 +52,14 @@ const Search = ({ queryParams }) => {
const title = `${catalog_resource.origin} - ${catalog_resource.request.path.id} ${catalog_resource.request.path.type_name}`;
switch (catalog_resource.content.type) {
case 'Ready': {
const posterShape = catalog_resource.content.content.length > 0 ?
catalog_resource.content.content[0].posterShape
:
null;
return (
<MetaRow
key={index}
className={styles['search-row']}
className={classnames(styles['search-row'], styles['search-row-poster'], { [styles[`search-row-${posterShape}`]]: typeof posterShape === 'string' })}
title={title}
items={catalog_resource.content.content}
itemComponent={MetaItem}
@ -78,7 +83,7 @@ const Search = ({ queryParams }) => {
return (
<MetaRow.Placeholder
key={index}
className={styles['search-row']}
className={classnames(styles['search-row'], styles['search-row-poster'])}
title={title}
href={href}
/>

60
src/routes/Search/styles.less
View file

@ -97,13 +97,21 @@
@media only screen and (max-width: @large) {
.search-container {
.search-content {
.search-row {
.search-row-poster, .search-row-square {
.meta-item, .meta-item-placeholder {
&:nth-child(n+10) {
display: none;
}
}
}
.search-row-landscape {
.meta-item, .meta-item-placeholder {
&:nth-child(n+9) {
display: none;
}
}
}
}
}
}
@ -111,13 +119,21 @@
@media only screen and (max-width: @normal) {
.search-container {
.search-content {
.search-row {
.search-row-poster, .search-row-square {
.meta-item, .meta-item-placeholder {
&:nth-child(n+9) {
display: none;
}
}
}
.search-row-landscape {
.meta-item, .meta-item-placeholder {
&:nth-child(n+8) {
display: none;
}
}
}
}
}
}
@ -125,13 +141,21 @@
@media only screen and (max-width: @medium) {
.search-container {
.search-content {
.search-row {
.search-row-poster, .search-row-square {
.meta-item, .meta-item-placeholder {
&:nth-child(n+8) {
display: none;
}
}
}
.search-row-landscape {
.meta-item, .meta-item-placeholder {
&:nth-child(n+7) {
display: none;
}
}
}
}
}
}
@ -139,13 +163,21 @@
@media only screen and (max-width: @small) {
.search-container {
.search-content {
.search-row {
.search-row-poster, .search-row-square {
.meta-item, .meta-item-placeholder {
&:nth-child(n+7) {
display: none;
}
}
}
.search-row-landscape {
.meta-item, .meta-item-placeholder {
&:nth-child(n+6) {
display: none;
}
}
}
}
}
}
@ -153,13 +185,21 @@
@media only screen and (max-width: @xsmall) {
.search-container {
.search-content {
.search-row {
.search-row-poster, .search-row-square {
.meta-item, .meta-item-placeholder {
&:nth-child(n+6) {
display: none;
}
}
}
.search-row-landscape {
.meta-item, .meta-item-placeholder {
&:nth-child(n+5) {
display: none;
}
}
}
}
}
}
@ -167,13 +207,21 @@
@media only screen and (max-width: @minimum) {
.search-container {
.search-content {
.search-row {
.search-row-poster, .search-row-square {
.meta-item, .meta-item-placeholder {
&:nth-child(n+5) {
display: none;
}
}
}
.search-row-landscape {
.meta-item, .meta-item-placeholder {
&:nth-child(n+4) {
display: none;
}
}
}
}
}
}