ODWRTW/canape
2
2
Fork 0
Code Issues 3 Pull Requests 1 Releases Activity

Fix the posters not aligned in the poster list

Browse Source
This commit is contained in:
Grégoire Delattre 2017-01-28 16:40:53 +01:00
parent e6bfb77dab
commit 745489c411
2 changed files with 22 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/public/js/components/list/poster.js
View File

@ -3,14 +3,28 @@ import React from 'react'
export default function ListPoster(props) {
const selected = props.selected ? ' thumbnail-selected' : '';
const imgClass = 'thumbnail' + selected;
const displayClearFixLg = (props.index % 6) === 0;
const displayClearFixMd = (props.index % 4) === 0;
const displayClearFixSm = (props.index % 2) === 0;
return (
<div className="col-xs-12 col-sm-6 col-md-3 col-lg-2">
<a className={imgClass}>
<img
src={props.data.poster_url}
onClick={props.onClick}
/>
</a>
<div>
{displayClearFixLg &&
<div className="clearfix visible-lg"></div>
}
{displayClearFixMd &&
<div className="clearfix visible-md"></div>
}
{displayClearFixSm &&
<div className="clearfix visible-sm"></div>
}
<div className="col-xs-12 col-sm-6 col-md-3 col-lg-2">
<a className={imgClass}>
<img
src={props.data.poster_url}
onClick={props.onClick}
/>
</a>
</div>
</div>
);
}

1
src/public/js/components/list/posters.js
View File

@ -48,6 +48,7 @@ export default function ListPosters(props) {
const selected = (el.imdb_id === props.selectedImdbId) ? true : false;
return (
<ListPoster
index={index}
data={el}
key={el.imdb_id}
selected={selected}