diff options
-rw-r--r-- | youtube/shared.css | 29 | ||||
-rw-r--r-- | yt_channel_items_template.html | 12 | ||||
-rw-r--r-- | yt_search_results_template.html | 17 |
3 files changed, 31 insertions, 27 deletions
diff --git a/youtube/shared.css b/youtube/shared.css index 432a1a1..240fd5c 100644 --- a/youtube/shared.css +++ b/youtube/shared.css @@ -57,6 +57,35 @@ address{ border-width:1px; } +.item-list{ + display: grid; + grid-auto-rows: 138px; + grid-row-gap: 10px; + +} + .item-list .video-thumbnail-box{ + width:246px; + } + .item-list .playlist-thumbnail-box{ + width:246px; + } + + +.item-grid{ + display:grid; + grid-template-columns: repeat(auto-fill, 400px); + grid-auto-rows: 94px; + grid-row-gap: 10px; +} + .item-grid .video-thumbnail-box{ + width:168px; + } + .item-grid .playlist-thumbnail-box{ + width:168px; + } + + + .full-item{ display: grid; diff --git a/yt_channel_items_template.html b/yt_channel_items_template.html index eb9b1e1..53e5901 100644 --- a/yt_channel_items_template.html +++ b/yt_channel_items_template.html @@ -72,19 +72,7 @@ .item-grid{ grid-row:4; grid-column: 1 / span 2; - - display:grid; - grid-template-columns: repeat(auto-fill, 400px); - grid-auto-rows: 94px; - grid-row-gap: 10px; - } - .item-grid .video-thumbnail-img{ - width:168px; - } - .item-grid .playlist-thumbnail-img{ - width:168px; - } .page-button-row{ grid-column: 1 / span 2; } diff --git a/yt_search_results_template.html b/yt_search_results_template.html index 77fb74c..147c437 100644 --- a/yt_search_results_template.html +++ b/yt_search_results_template.html @@ -52,22 +52,9 @@ grid-row: 1; } - #results{ - + .item-list{ grid-row: 2; grid-column: 2; - - - display: grid; - grid-auto-rows: 138px; - grid-row-gap: 10px; - - } - #results .video-thumbnail-box{ - width:246px; - } - #results .playlist-thumbnail-box{ - width:246px; } .badge{ background-color:#cccccc; @@ -90,7 +77,7 @@ <div id="number-of-results">Approximately $number_of_results results ($number_of_pages pages)</div> $corrections </div> - <div id="results"> + <div class="item-list"> $results </div> <nav class="page-button-row"> |