Add buffer btwn content and footer on some pages

assets/css/default.css

@@ -621,3 +621,13 @@ p,
 #content-navigation {
     margin-bottom: 0.5em;
 }
+
+#footer_buffer {
+  margin-top: 50vh;
+}
+
+@media screen and (max-width: 450px) {
+  #footer_buffer {
+    display: none;
+  }
+}

src/invidious/helpers/macros.cr

@@ -48,8 +48,10 @@ module JSON::Serializable
   end
 end
 
-macro templated(filename, template = "template", navbar_search = true)
+macro templated(filename, template = "template", navbar_search = true, buffer_footer=false)
   navbar_search = {{navbar_search}}
+  buffer_footer = {{buffer_footer}}
+
   render "src/invidious/views/#{{{filename}}}.ecr", "src/invidious/views/#{{{template}}}.ecr"
 end
 

src/invidious/routes/channels.cr

@@ -59,7 +59,7 @@ module Invidious::Routes::Channels
     items = items.select { |item| item.is_a?(SearchPlaylist) }.map { |item| item.as(SearchPlaylist) }
     items.each { |item| item.author = "" }
 
-    templated "channel/playlists"
+    templated "channel/playlists", buffer_footer: true
   end
 
   def self.community(env)
@@ -126,7 +126,7 @@ module Invidious::Routes::Channels
       featured_channel_categories = fetch_channel_featured_channels(ucid, channel.tabs["channels"], nil, nil).not_nil!
     end
 
-    templated "channel/featured_channels"
+    templated "channel/featured_channels", buffer_footer: true
   end
 
   def self.featured_channel_category(env)
@@ -172,7 +172,8 @@ module Invidious::Routes::Channels
       next error_template(500, ex)
     end
 
-    templated "channel/about"  end
+    templated "channel/about", buffer_footer: true
+  end
 
   # Redirects brand url channels to a normal /channel/:ucid route
 

src/invidious/routes/preferences.cr

@@ -8,7 +8,7 @@ module Invidious::Routes::PreferencesRoute
 
     preferences = env.get("preferences").as(Preferences)
 
-    templated "preferences"
+    templated "preferences", buffer_footer: true
   end
 
   def self.update(env)

src/invidious/views/template.ecr

@@ -132,6 +132,10 @@
         <script src="/js/notifications.js?v=<%= ASSET_COMMIT %>"></script>
     <% end %>
     
+    <% if buffer_footer %>
+        <div id="footer_buffer"></div>
+    <% end %>
+    
     <footer class="pure-g">
         <div class="pure-u-1 pure-u-md-2-24"></div>
         <div class="h-box pure-u-1 pure-u-md-20-24">