Proportional scaling inside grid (#1514)

* Proportional scaling inside grid

Cards inside grid (subscriptions, trending and others using the same system) now scale according to grid size.

* Update _ft-list-item.sass

Co-authored-by: Preston <freetubeapp@protonmail.com>

src/renderer/components/ft-auto-grid/ft-auto-grid.sass

@@ -1,7 +1,7 @@
 .ft-auto-grid
   &.grid
     display: grid
-    grid-template-columns: repeat(auto-fill, 262px)
+    grid-template-columns: repeat(auto-fill, minmax(262px, 1fr) )
     justify-content: space-evenly
     grid-gap: 8px
 

src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.css

@@ -1,6 +1,5 @@
 .grid {
   min-height: 264px;
-  display: flex;
 }
 
 .list {

src/renderer/sass-partials/_ft-list-item.sass

@@ -44,14 +44,12 @@ $thumbnail-overlay-opacity: 0.85
       opacity: 1
 
   .videoThumbnail
-    display: flex
     position: relative
 
     .thumbnailLink
       display: flex
 
     .thumbnailImage
-      height: 130px
 
       @include is-sidebar-item
         height: 75px
@@ -62,6 +60,7 @@ $thumbnail-overlay-opacity: 0.85
 
     .videoWatched
       position: absolute
+      top:0
       padding: 2px
       opacity: $thumbnail-overlay-opacity
       color: var(--primary-text-color)
@@ -207,7 +206,7 @@ $thumbnail-overlay-opacity: 0.85
       margin-bottom: 12px
 
       .thumbnailImage
-        width: 250px
+        width: 100%
 
     .title
       font-size: 18px