From 515e617f0de18505ace74c80e88aaa92fbc64fac Mon Sep 17 00:00:00 2001
From: syeopite <syeopite@syeopite.dev>
Date: Fri, 25 Jun 2021 19:47:42 -0700
Subject: [PATCH] Center sorting options on small displays (<640px)

---
 assets/css/channel.css                                 | 7 +++++++
 src/invidious/views/components/channel-information.ecr | 2 +-
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/assets/css/channel.css b/assets/css/channel.css
index 6fb95c1a..62480556 100644
--- a/assets/css/channel.css
+++ b/assets/css/channel.css
@@ -183,4 +183,11 @@ only show up when the screen is wide enough */
 
 #content-navigation {
   display: flex;
+}
+
+/* Center sorting options when screen is less than 640px*/
+@media screen and (max-width: 640px) {
+  #sort-options {
+    margin-right: auto;
+  }
 }
\ No newline at end of file
diff --git a/src/invidious/views/components/channel-information.ecr b/src/invidious/views/components/channel-information.ecr
index ec2eacc7..438ee621 100644
--- a/src/invidious/views/components/channel-information.ecr
+++ b/src/invidious/views/components/channel-information.ecr
@@ -181,7 +181,7 @@
         <% route = content_type == 1 ? "/videos" : "/playlists" %>
         <% url = "/channel/#{channel.ucid + route}" %>
 
-        <div class="pure-menu pure-menu-horizontal" style="display: flex;">
+        <div class="pure-menu pure-menu-horizontal" id="sort-options" style="display: flex;">
             <ul class="pure-menu-list" style="margin-left: auto;">
                 <% sort_options.each do |sort| %>
                     <% if sort_by == sort %>