sidebar shows up on mobile

1 files changed, 20 insertions, 4 deletions

diff --git a/alabaster-lite/css/fkfd.css b/alabaster-lite/css/fkfd.css
index aa27b35..901dcaa 100644
--- a/alabaster-lite/css/fkfd.css
+++ b/alabaster-lite/css/fkfd.css
@@ -135,6 +135,17 @@ div.footer a {
   }
 }
 
+@media screen and (max-width: 870px) {
+  div.sphinxsidebar {
+    float: none;
+    width: 100%;
+    margin: 0 -20px 0;
+    padding: 0 20px;
+    background-color: transparent;
+    color: #ccc;
+  }
+}
+
 /*
  * Custom home page for fkfd.me
  * Created on 2022-12-28
@@ -150,7 +161,7 @@ div.footer a {
 .webring-block-container {
   display: grid;
   gap: 0px;
-  grid-template-columns: 120px 120px 120px;
+  grid-template-columns: 60px 60px 60px;
 }
 
 @media screen and (max-width: 870px) {
@@ -171,8 +182,6 @@ div.footer a {
 
 .category-icon, .webring-icon {
   display: block;
-  width: 120px;
-  height: 120px;
   background-color: #3E4349;
   background-size: contain;
   background-repeat: no-repeat;
@@ -182,7 +191,14 @@ div.footer a {
   -webkit-mask-repeat: no-repeat;
 }
 
-@media screen and (max-width: 870px) {
+.category-icon {
+  width: 120px;
+  height: 120px;
+}
+
+.webring-icon {
+  width: 60px;
+  height: 60px;
 }
 
 @media (prefers-color-scheme: dark) {