From e6bfb77daba771f2837f7451fe357e1c75a9f671 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Gr=C3=A9goire=20Delattre?= <gregoire.delattre@gmail.com>
Date: Thu, 26 Jan 2017 23:04:05 +0100
Subject: [PATCH 1/2] Add more responsiveness to the movie list

---
 src/public/js/components/list/filter.js |  2 +-
 src/public/js/components/movies/list.js | 26 ++++++++++++-------------
 2 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/src/public/js/components/list/filter.js b/src/public/js/components/list/filter.js
index 8396379..6137836 100644
--- a/src/public/js/components/list/filter.js
+++ b/src/public/js/components/list/filter.js
@@ -12,7 +12,7 @@ export default function ListFilter(props) {
             placeholder={props.controlPlaceHolder}
             updateOn="change"
           />
-          <span className="input-group-btn">
+          <span className="input-group-btn hidden-xs">
             <button className="btn btn-default btn-sm" type="button">Filter</button>
           </span>
         </Form>
diff --git a/src/public/js/components/movies/list.js b/src/public/js/components/movies/list.js
index ece9a55..2111e16 100644
--- a/src/public/js/components/movies/list.js
+++ b/src/public/js/components/movies/list.js
@@ -11,19 +11,6 @@ function MovieButtons(props) {
   const hasMovie = (props.movie.polochon_url !== "")
   return (
     <div className="list-details-buttons btn-toolbar">
-      {hasMovie &&
-        <a type="button" className="btn btn-primary btn-sm" href={props.movie.polochon_url}>
-          <i className="fa fa-download"></i> Download
-        </a>
-      }
-
-      {props.movie.torrents &&
-          <TorrentsButton
-            torrents={props.movie.torrents}
-            addTorrent={props.addTorrent}
-          />
-      }
-
       <ActionsButton
         fetching={props.fetching}
         movieId={props.movie.imdb_id}
@@ -36,6 +23,19 @@ function MovieButtons(props) {
         deleteFromWishlist={props.deleteFromWishlist}
       />
 
+      {props.movie.torrents &&
+          <TorrentsButton
+            torrents={props.movie.torrents}
+            addTorrent={props.addTorrent}
+          />
+      }
+
+      {hasMovie &&
+        <a type="button" className="btn btn-primary btn-sm" href={props.movie.polochon_url}>
+          <i className="fa fa-download"></i> Download
+        </a>
+      }
+
       <a type="button" className="btn btn-warning btn-sm" href={imdb_link}>
         <i className="fa fa-external-link"></i> IMDB
       </a>

From 745489c4110f2de665240e0078b82642adca2464 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Gr=C3=A9goire=20Delattre?= <gregoire.delattre@gmail.com>
Date: Sat, 28 Jan 2017 16:40:53 +0100
Subject: [PATCH 2/2] Fix the posters not aligned in the poster list

---
 src/public/js/components/list/poster.js  | 28 ++++++++++++++++++------
 src/public/js/components/list/posters.js |  1 +
 2 files changed, 22 insertions(+), 7 deletions(-)

diff --git a/src/public/js/components/list/poster.js b/src/public/js/components/list/poster.js
index e5f8d57..de477f5 100644
--- a/src/public/js/components/list/poster.js
+++ b/src/public/js/components/list/poster.js
@@ -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>
   );
 }
diff --git a/src/public/js/components/list/posters.js b/src/public/js/components/list/posters.js
index 64faf12..cf44062 100644
--- a/src/public/js/components/list/posters.js
+++ b/src/public/js/components/list/posters.js
@@ -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}