commit 138d9ef3ca8b830d9cdc57e23cbf7a37c6681fa9
parent 77be0140471e76f9ca64a872a660b30ec3aad33b
Author: Stephen Thompson <sthompson@mozilla.com>
Date: Thu, 18 Dec 2025 17:27:20 +0000
Bug 2005000 - update 12x12 tab notes icon r=desktop-theme-reviewers,tabbrowser-reviewers,dao
- update SVG with adjusted design
- use 12x12 tab notes icon on tabs instead of 16x16 tab notes icon
- shrink the tab notes icon size on tabs from 16 to 12 due to the change in icon; this also shrinks the box size from 24px to 20px
Differential Revision: https://phabricator.services.mozilla.com/D275645
Diffstat:
4 files changed, 10 insertions(+), 16 deletions(-)
diff --git a/browser/themes/shared/tabbrowser/tabs.css b/browser/themes/shared/tabbrowser/tabs.css
@@ -241,10 +241,10 @@ tab-split-view-wrapper[dragtarget] {
--tab-min-width-extra-icons: 24px;
}
&[tab-note]:not([muted], [soundplaying], [activemedia-blocked]) {
- --tab-min-width-extra-icons: 24px;
+ --tab-min-width-extra-icons: 20px;
}
&[tab-note]:is([muted], [soundplaying], [activemedia-blocked]) {
- --tab-min-width-extra-icons: 48px;
+ --tab-min-width-extra-icons: 44px;
}
}
}
@@ -2559,12 +2559,12 @@ toolbar:not(#TabsToolbar) #firefox-view-button {
display: none;
box-sizing: border-box;
- width: calc(var(--icon-size) + 8px);
- height: calc(var(--icon-size) + 8px);
+ width: calc(var(--icon-size-xsmall) + 8px);
+ height: calc(var(--icon-size-xsmall) + 8px);
padding: 4px;
- margin-inline-end: calc(var(--tab-inline-padding) / -2);
+ margin-inline-end: calc(var(--tab-close-button-padding) / -2);
- list-style-image: url("chrome://global/skin/icons/tab-notes.svg");
+ list-style-image: url("chrome://global/skin/icons/tab-notes-12.svg");
-moz-context-properties: fill;
fill: var(--icon-color);
@@ -2574,7 +2574,8 @@ toolbar:not(#TabsToolbar) #firefox-view-button {
* the close button is not showing because the tab is not being hovered.
*/
.tabbrowser-tab:not(:hover) & {
- margin-inline-end: calc(var(--icon-size) + 8px - var(--tab-close-button-padding));
+ /* .tab-close-button is 24px wide with border-box sizing */
+ margin-inline-end: calc(24px - var(--tab-close-button-padding));
}
.tabbrowser-tab:is([visuallyselected], :hover) & {
margin-inline-end: calc(var(--tab-close-button-padding) / -2);
diff --git a/toolkit/themes/shared/desktop-jar.inc.mn b/toolkit/themes/shared/desktop-jar.inc.mn
@@ -115,7 +115,6 @@
skin/classic/global/icons/trending.svg (../../shared/icons/trending.svg)
skin/classic/global/icons/trophy.svg (../../shared/icons/trophy.svg)
skin/classic/global/icons/tab-notes-12.svg (../../shared/icons/tab-notes-12.svg)
- skin/classic/global/icons/tab-notes.svg (../../shared/icons/tab-notes.svg)
skin/classic/global/icons/update-icon.svg (../../shared/icons/update-icon.svg)
skin/classic/global/icons/arrow-down-12.svg (../../shared/icons/arrow-down-12.svg)
skin/classic/global/icons/arrow-down.svg (../../shared/icons/arrow-down.svg)
diff --git a/toolkit/themes/shared/icons/tab-notes-12.svg b/toolkit/themes/shared/icons/tab-notes-12.svg
@@ -1,6 +1,4 @@
<!-- 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 width="12" height="12" viewBox="0 0 12 12" fill="context-fill" fill-opacity="context-fill-opacity" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M9.52441 1C10.3396 1.00022 10.9992 1.66089 11.001 2.47461V7.33789C11.001 7.49909 10.9387 7.65415 10.8271 7.77051L7.91016 10.8086C7.7923 10.9313 7.62915 11.001 7.45898 11.001H2.47559C1.66073 11.0008 1.00021 10.3403 1 9.52539V2.47559C1.00022 1.66074 1.66074 1.00022 2.47559 1H9.52441ZM2.47559 2.25C2.35109 2.25022 2.25022 2.35109 2.25 2.47559V9.52539C2.25021 9.6499 2.35109 9.75075 2.47559 9.75098H7V7.5C7 7.224 7.224 7 7.5 7H9.75098V2.47754L9.74609 2.43164C9.72477 2.32779 9.63331 2.2502 9.52441 2.25H2.47559Z"/>
-</svg>
+<svg width="12" height="12" fill="context-fill" fill-opacity="context-fill-opacity" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M9.75.75a1.5 1.5 0 0 1 1.5 1.5v5.337a.625.625 0 0 1-.174.433L8.16 11.058a.626.626 0 0 1-.451.192H2.25a1.5 1.5 0 0 1-1.5-1.5v-7.5a1.5 1.5 0 0 1 1.5-1.5h7.5zM2.25 2a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h5V7.75a.5.5 0 0 1 .5-.5H10v-5A.25.25 0 0 0 9.75 2h-7.5z"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h12v12H0z"/></clipPath></defs></svg>
+\ No newline at end of file
diff --git a/toolkit/themes/shared/icons/tab-notes.svg b/toolkit/themes/shared/icons/tab-notes.svg
@@ -1,4 +0,0 @@
-<!-- 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 width="16" height="16" fill="context-fill" fill-opacity="context-fill-opacity" xmlns="http://www.w3.org/2000/svg"><path d="m14.78 10.78-4 4a.747.747 0 0 1-.53.22H3a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v7.25c0 .199-.079.39-.22.53zm-1.28-.841V3c0-.275-.225-.5-.5-.5H3c-.275 0-.5.225-.5.5v10c0 .275.225.5.5.5h6.939l.061-.061V10.5a.5.5 0 0 1 .5-.5h2.939l.061-.061z"/></svg>
-\ No newline at end of file
