adjusted /popular for smaller screens

helpers/handlebarsHelpers.js

@@ -51,7 +51,7 @@ module.exports = {
     }
   },
   addTwitterCard (mimeType, source, embedUrl, directFileUrl) {
-    let basicTwitterTags = `<meta name="twitter:site" content="@speechch" >`;
+    let basicTwitterTags = `<meta name="twitter:site" content="@spee_ch" >`;
     if (mimeType === 'video/mp4') {
       return new Handlebars.SafeString(
                 `${basicTwitterTags} <meta name="twitter:card" content="player" >

public/assets/css/general.css

@@ -529,7 +529,7 @@ table {
 /* ---- grid items ---- */
 
 .grid-item {
-	width: calc(31% - 2rem);
+	width: calc(33% - 2rem);
 	padding: 0px;
 	margin: 1rem;
 	float: left;

public/assets/css/mediaQueries.css

@@ -61,7 +61,6 @@
 	#publish-active-area > .row, #publish-details > .row, #channel-login-form > .row, #publish-channel-form > .row {
 		padding: 1em 0px 1em 0px;
 	}
-
 }
 
 @media (max-width: 450px) {
@@ -74,6 +73,13 @@
 		font-size: medium;
 	}
 
+	.grid-item {
+		width: 100%;
+		float: none;
+		padding-bottom: 2rem;
+		margin: 0px;
+	}
+
 }
 
 @media (max-width: 360px) {

views/popular.handlebars

@@ -1,7 +1,9 @@
-<div class="row row--narrow grid">
-    {{#each trendingAssets}}
-        {{> gridItem}}
-    {{/each}}
+<div class="row row--narrow">
+    <div class="grid">
+        {{#each trendingAssets}}
+            {{> gridItem}}
+        {{/each}}
+    </div>
 </div>
 
 <script src="/assets/vendors/masonry/masonry.pkgd.min.js"></script>
@@ -19,8 +21,4 @@
         });
     });
 
-    // init with selector
-//    var msnry = new Masonry( '.grid', {
-//        // options...
-//    });
 </script>