From e940cac4e1cf2ad51b142025b6171fee76f3a20d Mon Sep 17 00:00:00 2001
From: HenriDellal <anridellal@gmail.com>
Date: Wed, 19 May 2021 23:07:59 +0200
Subject: [PATCH] preferences.css: various tweaks (MR 8)

* center icons in sidebar
* make it adaptive
---
 src/userContent/preferences.css | 39 +++++++++++++++++++++++----------
 1 file changed, 27 insertions(+), 12 deletions(-)

diff --git a/src/userContent/preferences.css b/src/userContent/preferences.css
index 66ff115..3bd8eaf 100644
--- a/src/userContent/preferences.css
+++ b/src/userContent/preferences.css
@@ -1,17 +1,32 @@
 @-moz-document url("about:preferences"), url-prefix("about:preferences") {
-    /* avoid that sidebar is too wide */
-    .navigation {
-        max-width: 50px;
+    @media (max-width: 700px) {
+        /* avoid that sidebar is too wide */
+        :root {
+            --in-content-sidebar-width: 50px !important;
+        }
+
+        #categories > .category {
+            margin-inline-start: auto !important;
+            padding-inline: auto !important;
+        }
+
+        .category-name {
+            display: none !important;
+        }
+
+        .sidebar-footer-list {
+            margin-inline: auto !important;
+            padding-inline: auto !important;
+        }
+
+        .sidebar-footer-label {
+            display:none !important;
+        }
     }
 
-    /* reduce space around category icons */
-    #categories > .category {
-        margin-inline-start: 2px !important;
-        padding-inline: 2px !important;
-    }
-
-    /* reduce space around footer icons (addons, help) */
-    .sidebar-footer-list {
-        margin-inline: 2px !important;
+    @media (max-height: 400px) {
+        #categories {
+            margin-top: 8px !important;
+        }
     }
 }