Bug 1394206 - Fix spacing of in-content prefs with narrow window. r=jorgk
authorRichard Marti <richard.marti@gmail.com>
Sun, 27 Aug 2017 12:50:25 +0200
changeset 29633 19b1cdcc93f30773ff9992d8bfe87820f8ac1a92
parent 29632 6d35f2d9bf66d6a7a8c5ec862424911199d3774f
child 29634 4cdc9415f29b71b84ed88cee9b24b85a253b268d
push id378
push userclokep@gmail.com
push dateMon, 13 Nov 2017 18:45:35 +0000
reviewersjorgk
bugs1394206
Bug 1394206 - Fix spacing of in-content prefs with narrow window. r=jorgk
mail/themes/shared/mail/incontentprefs/aboutPreferences.css
--- a/mail/themes/shared/mail/incontentprefs/aboutPreferences.css
+++ b/mail/themes/shared/mail/incontentprefs/aboutPreferences.css
@@ -65,34 +65,34 @@ caption > label {
 
 /* Category List */
 
 .paneSelector {
   -moz-appearance: none;
   background-color: transparent;
   background-image: none;
   border-bottom: none;
-  padding: 40px 0 0;
+  padding: 54px 0 0;
   margin: 0;
   max-height: 100vh;
   overflow-x: auto;
 }
 
 radio[pane] {
   -moz-box-orient: horizontal;
   -moz-appearance: none;
   width: 240px;
   color: var(--in-content-category-text);
   border-right-width: 0;
   border-left-width: 0;
   border-radius: 2px;
   margin-inline-start: 34px;
   margin-inline-end: 0;
   padding: 5px 10px;
-  min-height: 44px;
+  min-height: 40px;
   transition: background-color 150ms;
 }
 
 radio[pane][selected] {
   color: var(--in-content-category-text-selected);
   background: none;
 }
 
@@ -141,22 +141,23 @@ radio[pane][selected] > .paneButtonIcon 
   }
 
   .paneButtonLabel {
     display: none;
   }
 
   radio[pane] {
     min-width: 44px;
-    margin-inline-end: 40px;
+    padding-inline-start: 13px; /* make icons align center */
+    margin-inline-end: 35px;
   }
 
   #preferencesContainer {
-    padding-inline-start: 0;
-    padding-inline-end: 10px;
+    padding-inline-start: 15px;
+    padding-inline-end: 15px;
   }
 }
 
 radio[pane=paneGeneral] > .paneButtonIcon {
   list-style-image: url("chrome://messenger/skin/shared/in-content/general.svg");
 }
 
 radio[pane=paneDisplay] > .paneButtonIcon {