From f4024573dcbd4a19e7138814bbc54ac0a653f3d3 Mon Sep 17 00:00:00 2001
From: James Taylor <user234683@users.noreply.github.com>
Date: Sun, 8 Jul 2018 16:27:08 -0700
Subject: [PATCH] add checkbox to medium items

---
 youtube/common.py  | 67 +++++++++++++++++++++++++---------------------
 youtube/shared.css |  9 +++++++
 2 files changed, 46 insertions(+), 30 deletions(-)

diff --git a/youtube/common.py b/youtube/common.py
index f0d6694..d3e3c0d 100644
--- a/youtube/common.py
+++ b/youtube/common.py
@@ -51,32 +51,37 @@ page_button_template = Template('''<a class="page-button" href="$href">$page</a>
 current_page_button_template = Template('''<div class="current-page-button">$page</a>''')
 
 medium_playlist_item_template = Template('''
-                <div class="medium-item">
-                    <a class="playlist-thumbnail-box" href="$url" title="$title">
-                        <img class="playlist-thumbnail-img" src="$thumbnail">
-                        <div class="playlist-thumbnail-info">
-                            <span>$size</span>
-                        </div>
-                    </a>
+                <div class="medium-item-box">
+                    <div class="medium-item">
+                        <a class="playlist-thumbnail-box" href="$url" title="$title">
+                            <img class="playlist-thumbnail-img" src="$thumbnail">
+                            <div class="playlist-thumbnail-info">
+                                <span>$size</span>
+                            </div>
+                        </a>
 
-                    <a class="title" href="$url" title="$title">$title</a>
-                    
-                    <div class="stats">$stats</div>
+                        <a class="title" href="$url" title="$title">$title</a>
+                        
+                        <div class="stats">$stats</div>
+                    </div>
                 </div>
 ''')
 medium_video_item_template = Template('''
-                <div class="medium-item">
-                    <a class="video-thumbnail-box" href="$url" title="$title">
-                        <img class="video-thumbnail-img" src="$thumbnail">
-                        <span class="video-duration">$duration</span>
-                    </a>
+                <div class="medium-item-box">
+                    <div class="medium-item">
+                        <a class="video-thumbnail-box" href="$url" title="$title">
+                            <img class="video-thumbnail-img" src="$thumbnail">
+                            <span class="video-duration">$duration</span>
+                        </a>
 
-                    <a class="title" href="$url">$title</a>
-                    
-                    <div class="stats">$stats</div>
+                        <a class="title" href="$url">$title</a>
+                        
+                        <div class="stats">$stats</div>
 
-                    <span class="description">$description</span>
-                    <span class="badges">$badges</span>
+                        <span class="description">$description</span>
+                        <span class="badges">$badges</span>
+                    </div>
+                    <input class="item-checkbox" type="checkbox" name="video_info_list" value="$video_info" form="playlist-add">
                 </div>
 ''')
 
@@ -114,18 +119,20 @@ small_playlist_item_template = Template('''
 ''')
 
 medium_channel_item_template = Template('''
-                <div class="medium-item">
-                    <a class="video-thumbnail-box" href="$url" title="$title">
-                        <img class="video-thumbnail-img" src="$thumbnail">
-                        <span class="video-duration">$duration</span>
-                    </a>
+                <div class="medium-item-box">
+                    <div class="medium-item">
+                        <a class="video-thumbnail-box" href="$url" title="$title">
+                            <img class="video-thumbnail-img" src="$thumbnail">
+                            <span class="video-duration">$duration</span>
+                        </a>
 
-                    <a class="title" href="$url">$title</a>
-                    
-                    <span>$subscriber_count</span>
-                    <span>$size</span>
+                        <a class="title" href="$url">$title</a>
+                        
+                        <span>$subscriber_count</span>
+                        <span>$size</span>
 
-                    <span class="description">$description</span>
+                        <span class="description">$description</span>
+                    </div>
                 </div>
 ''')
 
diff --git a/youtube/shared.css b/youtube/shared.css
index 340e164..12c1bb6 100644
--- a/youtube/shared.css
+++ b/youtube/shared.css
@@ -169,6 +169,11 @@ address{
         grid-row: 5;
     }
 
+.medium-item-box{
+
+    display:grid;
+    grid-template-columns: 1fr 0fr;
+}
 .medium-item{
     background-color:#bcbcbc;
     text-decoration:none;
@@ -291,6 +296,8 @@ address{
 
 /* ---Thumbnails for videos---- */
 .video-thumbnail-box{
+    max-height:100%;
+
     grid-column:1;
     grid-row:1 / span 6;
     
@@ -313,6 +320,8 @@ address{
 
 /* ---Thumbnails for playlists---- */
 .playlist-thumbnail-box{
+    max-height:100%;
+
     grid-column:1;
     grid-row:1 / span 6;