From af04e54d7b7dbf0dce207c61a984e382e91b1bfc Mon Sep 17 00:00:00 2001
From: FireMasterK <20838718+FireMasterK@users.noreply.github.com>
Date: Fri, 13 Nov 2020 17:27:11 +0530
Subject: [PATCH] Enhancement to grid.

---
 src/components/Channel.vue      | 14 +++++++++-----
 src/components/TrendingPage.vue |  4 +++-
 2 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/components/Channel.vue b/src/components/Channel.vue
index 89f603a2..1df366a1 100644
--- a/src/components/Channel.vue
+++ b/src/components/Channel.vue
@@ -3,13 +3,17 @@
     <h1 class="uk-text-center"><img v-bind:src="channel.avatarUrl">{{ channel.name }}</h1>
     <img v-bind:src="channel.bannerUrl" style="width: 100%">
     <p v-html="this.channel.description.replaceAll('\n', '<br>')"></p>
-    <div class="" style="width: 100%" uk-grid="parallax: 0">
-        <div style="width: 260px" v-bind:key="item.url" v-for="item in this.channel.relatedStreams">
-            <router-link class="uk-link-muted" v-bind:to="item.url || '/'">
+
+    <hr>
+
+    <div class="uk-grid-small" style="width: 100%" uk-grid="parallax: 0">
+        <div style="width: 288px" v-bind:key="item.url" v-for="item in this.channel.relatedStreams">
+            <router-link class="uk-link-muted" style="height: 100px" v-bind:to="item.url || '/'">
                 <img style="width: 100%" v-bind:src="item.thumbnail">
-                <p>{{ item.title }}</p>
+                <a>{{ item.title }}</a>
             </router-link>
-            {{ timeFormat(item.duration) }}
+            <br>
+            <a>{{ timeFormat(item.duration) }}</a>
         </div>
     </div>
 </div>
diff --git a/src/components/TrendingPage.vue b/src/components/TrendingPage.vue
index a030fc2d..37cf4ff0 100644
--- a/src/components/TrendingPage.vue
+++ b/src/components/TrendingPage.vue
@@ -1,7 +1,9 @@
 <template>
 <h1 class="uk-text-bold uk-text-center">Trending</h1>
 
-<div class="" style="width: 100%" uk-grid="parallax: 0">
+<hr>
+
+<div class="uk-grid-collapse" style="width: 100%" uk-grid="parallax: 0">
     <div class="uk-tile-default" style="width: 300px; background: #0b0e0f" v-bind:key="video.url" v-for="video in videos">
         <div class="uk-card uk-card-default uk-card-body uk-grid-match uk-text-secondary" style="background: #0b0e0f">
             <router-link class="uk-text-emphasis" v-bind:to="video.url || '/'">