Nice movie scanning progress

couchpotato/core/media/movie/_base/static/manage.js

@@ -110,7 +110,8 @@ var MoviesManage = new Class({
 							return;
 
 						if(!self.progress_container)
-							self.progress_container = new Element('div.progress').inject(self.list.navigation, 'after');
+							self.progress_container = new Element('div.progress')
+								.inject(self.list, 'top');
 
 						self.progress_container.empty();
 

couchpotato/core/media/movie/_base/static/movie.scss

@@ -164,6 +164,31 @@ $mass_edit_height: 44px;
 			pointer-events: none;
 		}
 	}
+
+	.progress {
+
+		div {
+			width: 50%;
+			padding: $padding/4 $padding/2;
+			display: flex;
+
+			@include media-tablet {
+				width: 100%;
+			}
+
+			.folder {
+				flex: 1 auto;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				white-space: nowrap;
+				margin-right: $padding/2;
+			}
+
+			.percentage {
+				font-weight: bold;
+			}
+		}
+	}
 }
 
 .list_list {

couchpotato/static/scripts/combined.plugins.min.js

@@ -985,7 +985,7 @@ var MoviesManage = new Class({
                     } else {
                         var progress = json.progress;
                         if (!self.list.navigation) return;
-                        if (!self.progress_container) self.progress_container = new Element("div.progress").inject(self.list.navigation, "after");
+                        if (!self.progress_container) self.progress_container = new Element("div.progress").inject(self.list, "top");
                         self.progress_container.empty();
                         var sorted_table = self.parseProgress(json.progress);
                         sorted_table.each(function(folder) {

couchpotato/static/style/combined.min.css

@@ -126,6 +126,11 @@
 @media (max-width:480px){.movies .no_movies{padding:10px}
 .movies .actions{pointer-events:none}
 }
+.movies .progress div{width:50%;padding:5px 10px;display:-webkit-flex;display:-ms-flexbox;display:flex}
+@media (max-width:768px){.movies .progress div{width:100%}
+}
+.movies .progress div .folder{-webkit-flex:1 auto;-ms-flex:1 auto;flex:1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-right:10px}
+.movies .progress div .percentage{font-weight:700}
 .list_list{font-weight:300}
 .list_list .movie{display:block;border-bottom:1px solid #eaeaea;position:relative;cursor:pointer}
 .list_list .movie:last-child{border-bottom:none}