Bug 1691297 - Fix the dropmarker position .toolbarbutton-1[type="menu"] in "Icons and Text" toolbar mode. r=aleca
authorRichard Marti <richard.marti@gmail.com>
Fri, 30 Apr 2021 21:19:02 +0200
changeset 32479 b6cdba0a1e2f08d2c42edfdf0ee643df9e0261e2
parent 32478 ee2f502deca8d07b1346893e24df06b487a1c214
child 32480 1a9e14fcacef2ee99d972a811dfe21423cfd7e8a
push id18758
push userthunderbird@calypsoblue.org
push dateThu, 06 May 2021 21:51:17 +0000
treeherdercomm-central@b6cdba0a1e2f [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersaleca
bugs1691297
Bug 1691297 - Fix the dropmarker position .toolbarbutton-1[type="menu"] in "Icons and Text" toolbar mode. r=aleca
mail/themes/shared/mail/icons/toolbarbutton-arrow.svg
mail/themes/shared/mail/messenger.css
--- a/mail/themes/shared/mail/icons/toolbarbutton-arrow.svg
+++ b/mail/themes/shared/mail/icons/toolbarbutton-arrow.svg
@@ -1,6 +1,6 @@
 <!-- This Source Code Form is subject to the terms of the Mozilla Public
    - License, v. 2.0. If a copy of the MPL was not distributed with this
    - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 9 7">
-  <path fill="context-fill" d="M4.5 6.2A.9.9 0 0 1 3.8 6L.2 2.3A.9.9 0 0 1 1.5 1l3 3L7.5 1a.9.9 0 0 1 1.2 1.3L5.1 6a.9.9 0 0 1-.6.2z"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 9 7" fill="context-fill" fill-opacity="context-stroke-opacity">
+  <path d="M4.5 6.2A.9.9 0 0 1 3.8 6L.2 2.3A.9.9 0 0 1 1.5 1l3 3L7.5 1a.9.9 0 0 1 1.2 1.3L5.1 6a.9.9 0 0 1-.6.2z"/>
 </svg>
--- a/mail/themes/shared/mail/messenger.css
+++ b/mail/themes/shared/mail/messenger.css
@@ -415,35 +415,35 @@ toolbar:not([mode="text"]) .toolbarbutto
   background-clip: padding-box;
 }
 
 .toolbarbutton-1:not([disabled="true"]):is(:hover,[open="true"]) >
 .toolbarbutton-menubutton-button,
 .toolbarbutton-1:not([disabled="true"]):hover >
 .toolbarbutton-menubutton-dropmarker,
 .toolbarbutton-1:not([type="menu-button"],[disabled="true"],[checked="true"],[open="true"],:active):hover {
-  background: var(--toolbarbutton-hover-background);
+  background-color: var(--toolbarbutton-hover-background);
   border-color: var(--toolbarbutton-hover-bordercolor);
   box-shadow: var(--toolbarbutton-hover-boxshadow);
 }
 
 .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled="true"]):hover:active,
 .toolbarbutton-1[open="true"] > .toolbarbutton-menubutton-dropmarker:not([disabled="true"]),
 .toolbarbutton-1:not([type="menu-button"],[disabled="true"]):is([open="true"],[checked="true"],:hover:active) {
-  background: var(--toolbarbutton-checked-background);
+  background-color: var(--toolbarbutton-checked-background);
   border-color: var(--toolbarbutton-active-bordercolor);
   box-shadow: var(--toolbarbutton-active-boxshadow);
   transition-duration: 10ms;
 }
 
 .toolbarbutton-1:not([type="menu-button"],[disabled="true"]):hover:active,
 .toolbarbutton-1:not([type="menu-button"],[disabled="true"])[open="true"],
 .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled="true"]):hover:active,
 .toolbarbutton-1[open="true"] > .toolbarbutton-menubutton-dropmarker:not([disabled="true"]) {
-  background: var(--toolbarbutton-active-background) !important;
+  background-color: var(--toolbarbutton-active-background) !important;
 }
 
 .toolbarbutton-1[type="menu-button"] > .toolbarbutton-menubutton-button {
   border-inline-end: none;
   margin: 0;
 }
 
 .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
@@ -511,16 +511,42 @@ toolbox[labelalign="end"] > toolbar[mode
   height: 18px;
   background-image: linear-gradient(currentColor 0, currentColor 100%);
   background-position: center;
   background-repeat: no-repeat;
   background-size: 1px 18px;
   opacity: .2;
 }
 
+toolbox:not([labelalign="end"]) > toolbar[mode="full"]
+  .toolbarbutton-1:not(.button-appmenu)[type="menu"] {
+  padding-inline-end: 12px !important;
+  background-image: url("chrome://messenger/skin/icons/toolbarbutton-arrow.svg");
+  background-size: 9px;
+  background-repeat: no-repeat;
+  background-position: calc(100% - 4px) center;
+  -moz-context-properties: fill, fill-opacity, stroke-opacity;
+  stroke-opacity: 1;
+}
+
+toolbox:not([labelalign="end"]) > toolbar[mode="full"]
+  .toolbarbutton-1:not(.button-appmenu)[type="menu"]:-moz-locale-dir(rtl) {
+  background-position: 4px center;
+}
+
+toolbox:not([labelalign="end"]) > toolbar[mode="full"]
+  .toolbarbutton-1:not(.button-appmenu)[type="menu"][disabled="true"] {
+  stroke-opacity: 0.4;
+}
+
+toolbox:not([labelalign="end"]) > toolbar[mode="full"]
+  .toolbarbutton-1:not(.button-appmenu)[type="menu"] > .toolbarbutton-menu-dropmarker {
+  display: none;
+}
+
 toolbar[brighttext] .toolbarbutton-1:not(:hover,:active,[open]) >
   .toolbarbutton-menubutton-dropmarker::before {
   opacity: .3;
 }
 
 #alltabs-button,
 #tabbar-toolbar menulist,
 #tabbar-toolbar .toolbarbutton-1,