Bug 1789933 - Fix expander button size on Windows and Linux. r=Itiel

Differential Revision: https://phabricator.services.mozilla.com/D174770
iaxat · Apr 19, 2023 · 29ad768 · 29ad768
1 parent 7119dfa
commit 29ad768
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 24 deletions.
diff --git a/browser/themes/linux/places/organizer.css b/browser/themes/linux/places/organizer.css
@@ -111,7 +111,9 @@
   grid-column: 2;
 }
 
-#editBookmarkPanelContent input {
+#editBookmarkPanelContent input,
+.expander-up,
+.expander-down {
   margin: 4px;
 }
 

diff --git a/browser/themes/windows/places/organizer.css b/browser/themes/windows/places/organizer.css
@@ -332,13 +332,12 @@ treechildren::-moz-tree-separator(selected, focus) {
   border-top: 1px solid var(--organizer-border-color);
 }
 
-#editBookmarkPanelContent .expander-up,
-#editBookmarkPanelContent .expander-down {
+.expander-up,
+.expander-down {
   appearance: none;
   min-width: 0;
   padding: 5px;
-  margin: 0;
-  margin-inline-end: 4px;
+  margin: 4px;
   border: 1px solid var(--organizer-pane-field-border-color);
   border-radius: 4px;
   color: var(--organizer-color);
@@ -348,34 +347,34 @@ treechildren::-moz-tree-separator(selected, focus) {
   fill: currentColor;
 }
 
-#editBookmarkPanelContent .expander-up:hover,
-#editBookmarkPanelContent .expander-down:hover {
+.expander-up {
+  list-style-image: url("chrome://global/skin/icons/arrow-up-12.svg");
+}
+
+.expander-up:hover,
+.expander-down:hover {
   background-color: var(--organizer-hover-background);
   color: var(--organizer-hover-color);
 }
 
-#editBookmarkPanelContent .expander-up:hover:active,
-#editBookmarkPanelContent .expander-down:hover:active {
+.expander-up:hover:active,
+.expander-down:hover:active {
   background-color: var(--organizer-selected-background);
   color: var(--organizer-selected-color);
 }
 
-#editBookmarkPanelContent .expander-up:focus-visible,
-#editBookmarkPanelContent .expander-down:focus-visible {
+.expander-up:focus-visible,
+.expander-down:focus-visible {
   outline: 2px solid var(--organizer-outline-color);
   outline-offset: -1px;
 }
 
-#editBookmarkPanelContent .expander-up {
-  list-style-image: url("chrome://global/skin/icons/arrow-up-12.svg");
-}
-
-#editBookmarkPanelContent .expander-up > .button-box,
-#editBookmarkPanelContent .expander-down > .button-box {
+.expander-up > .button-box,
+.expander-down > .button-box {
   padding: 0;
 }
 
-#places input {
+input {
   border: 1px solid var(--organizer-pane-field-border-color);
   border-radius: 4px;
   background-color: var(--organizer-content-background);
@@ -384,24 +383,24 @@ treechildren::-moz-tree-separator(selected, focus) {
   padding-inline: 4px;
 }
 
-#places input:focus {
+input:focus {
   outline: 2px solid var(--organizer-outline-color);
   outline-offset: -1px;
 }
 
-#places input:not(:read-write):focus {
+input:not(:read-write):focus {
   outline: none;
 }
 
+#editBookmarkPanelContent input {
+  margin: 4px;
+}
+
 .caption-label {
   margin-inline-start: 8px;
   color: var(--organizer-deemphasized-color);
 }
 
-#editBookmarkPanelContent input {
-  margin: 4px;
-}
-
 #editBMPanel_tagsSelector {
   appearance: none;
   color: var(--organizer-color);