toolbarbutton-icons.css (9792B)
1 /* This Source Code Form is subject to the terms of the Mozilla Public 2 * License, v. 2.0. If a copy of the MPL was not distributed with this 3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ 4 5 .toolbarbutton-animatable-box, 6 .toolbarbutton-1 { 7 color: inherit; 8 -moz-context-properties: fill, fill-opacity; 9 fill: var(--toolbarbutton-icon-fill); 10 } 11 12 #back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, 13 #forward-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, 14 #reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, 15 #reload-button:-moz-locale-dir(rtl) > .toolbarbutton-animatable-box > .toolbarbutton-animatable-image, 16 #stop-button:-moz-locale-dir(rtl) > .toolbarbutton-animatable-box > .toolbarbutton-animatable-image, 17 #nav-bar-overflow-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, 18 #nav-bar-overflow-button:-moz-locale-dir(rtl) > .toolbarbutton-animatable-box > .toolbarbutton-animatable-image, 19 #PlacesChevron:-moz-locale-dir(rtl) > .toolbarbutton-icon, 20 #panic-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, 21 #PanelUI-menu-button:-moz-locale-dir(rtl) > .toolbarbutton-badge-stack > .toolbarbutton-icon { 22 scale: -1 1; 23 } 24 25 #back-button { 26 list-style-image: url("chrome://browser/skin/back.svg"); 27 } 28 29 #forward-button { 30 list-style-image: url("chrome://browser/skin/forward.svg"); 31 } 32 33 #reload-button { 34 list-style-image: url("chrome://global/skin/icons/reload.svg"); 35 } 36 37 #stop-button { 38 list-style-image: url("chrome://global/skin/icons/close.svg"); 39 } 40 41 #home-button { 42 list-style-image: url("chrome://browser/skin/home.svg"); 43 } 44 45 #bookmarks-toolbar-button, 46 #bookmarks-toolbar-placeholder { 47 list-style-image: url("chrome://browser/skin/bookmarks-toolbar.svg"); 48 } 49 50 #bookmarks-menu-button { 51 list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg"); 52 } 53 54 #history-panelmenu { 55 list-style-image: url("chrome://browser/skin/history.svg"); 56 } 57 58 #downloads-button { 59 list-style-image: url("chrome://browser/skin/downloads/downloads.svg"); 60 } 61 62 #open-file-button { 63 list-style-image: url("chrome://browser/skin/open.svg"); 64 } 65 66 #screenshot-button { 67 list-style-image: url("chrome://browser/skin/screenshot.svg"); 68 } 69 70 #save-page-button { 71 list-style-image: url("chrome://browser/skin/save.svg"); 72 } 73 74 #sync-button { 75 list-style-image: url("chrome://browser/skin/synced-tabs.svg"); 76 } 77 78 #characterencoding-button { 79 list-style-image: url("chrome://browser/skin/characterEncoding.svg"); 80 } 81 82 #new-window-button { 83 list-style-image: url("chrome://browser/skin/window.svg"); 84 } 85 86 #new-tab-button { 87 list-style-image: url("chrome://browser/skin/new-tab.svg"); 88 } 89 90 #new-identity-button { 91 list-style-image: url("chrome://browser/skin/new_identity.svg"); 92 } 93 94 #new-circuit-button { 95 list-style-image: url("chrome://browser/skin/new_circuit.svg"); 96 } 97 98 #privatebrowsing-button { 99 list-style-image: url("chrome://browser/skin/privateBrowsing.svg"); 100 } 101 102 #find-button { 103 list-style-image: url("chrome://global/skin/icons/search-glass.svg"); 104 } 105 106 #print-button { 107 list-style-image: url("chrome://global/skin/icons/print.svg"); 108 } 109 110 #fullscreen-button { 111 list-style-image: url("chrome://browser/skin/fullscreen.svg"); 112 } 113 114 #developer-button { 115 list-style-image: url("chrome://global/skin/icons/developer.svg"); 116 } 117 118 #profiler-button-button > .toolbarbutton-icon { 119 list-style-image: url("chrome://devtools/skin/images/tool-profiler.svg"); 120 } 121 122 #profiler-button-button:not(.profiler-active) > image { 123 transform: scaleX(-1); 124 } 125 126 #profiler-button-button.profiler-active > image { 127 fill: #0060df; 128 fill-opacity: 1; 129 background-color: #0060df33; 130 } 131 132 #profiler-button-button.profiler-active:hover > image { 133 background-color: #0060df22; 134 } 135 136 #profiler-button-button.profiler-paused > image { 137 opacity: 0.4; 138 } 139 140 #preferences-button { 141 list-style-image: url("chrome://global/skin/icons/settings.svg"); 142 } 143 144 #PanelUI-menu-button { 145 list-style-image: url("chrome://browser/skin/menu.svg"); 146 } 147 148 #PanelUI-menu-button[badge-status="update-available"], 149 #PanelUI-menu-button[badge-status="update-downloading"], 150 #PanelUI-menu-button[badge-status="update-manual"], 151 #PanelUI-menu-button[badge-status="update-other-instance"], 152 #PanelUI-menu-button[badge-status="update-restart"], 153 #PanelUI-menu-button[badge-status="update-unsupported"], 154 #PanelUI-menu-button[badge-status="addon-alert"], 155 #PanelUI-menu-button[badge-status="fxa-needs-authentication"] { 156 list-style-image: url("chrome://browser/skin/menu-badged.svg"); 157 } 158 159 #cut-button { 160 list-style-image: url("chrome://browser/skin/edit-cut.svg"); 161 } 162 163 #copy-button { 164 list-style-image: url("chrome://global/skin/icons/edit-copy.svg"); 165 } 166 167 #paste-button { 168 list-style-image: url("chrome://browser/skin/edit-paste.svg"); 169 } 170 171 #zoom-out-button { 172 list-style-image: url("chrome://global/skin/icons/minus.svg"); 173 } 174 175 #zoom-in-button { 176 list-style-image: url("chrome://global/skin/icons/plus.svg"); 177 } 178 179 #PlacesChevron, 180 #nav-bar-overflow-button { 181 list-style-image: url("chrome://global/skin/icons/chevron.svg"); 182 } 183 184 #unified-extensions-button { 185 list-style-image: url("chrome://mozapps/skin/extensions/extension.svg"); 186 } 187 188 #reset-pbm-toolbar-button { 189 list-style-image: url("chrome://browser/skin/flame.svg"); 190 } 191 192 #email-link-button { 193 list-style-image: url("chrome://browser/skin/mail.svg"); 194 } 195 196 #logins-button { 197 list-style-image: url("chrome://browser/skin/login.svg"); 198 } 199 200 #sidebar-button { 201 /* stylelint-disable-next-line media-query-no-invalid */ 202 @media not -moz-pref("sidebar.revamp") { 203 list-style-image: url("chrome://browser/skin/sidebars.svg"); 204 205 &:-moz-locale-dir(ltr)[sidebar-positionend], 206 &:-moz-locale-dir(rtl):not([sidebar-positionend]) { 207 list-style-image: url("chrome://browser/skin/sidebars-right.svg"); 208 } 209 } 210 211 /* stylelint-disable-next-line media-query-no-invalid */ 212 @media -moz-pref("sidebar.revamp") { 213 list-style-image: url("chrome://browser/skin/sidebar-collapsed.svg"); 214 215 /* stylelint-disable-next-line media-query-no-invalid */ 216 @media -moz-pref("sidebar.verticalTabs") { 217 &:hover { 218 list-style-image: url("chrome://browser/skin/sidebar-expanded.svg"); 219 } 220 } 221 222 &[expanded] { 223 list-style-image: url("chrome://browser/skin/sidebar-expanded.svg"); 224 225 &:hover { 226 list-style-image: url("chrome://browser/skin/sidebar-collapsed.svg"); 227 } 228 } 229 230 &:-moz-locale-dir(ltr)[sidebar-positionend], 231 &:-moz-locale-dir(rtl):not([sidebar-positionend]) { 232 list-style-image: url("chrome://browser/skin/sidebar-collapsed-right.svg"); 233 234 /* stylelint-disable-next-line media-query-no-invalid */ 235 @media -moz-pref("sidebar.verticalTabs") { 236 &:hover { 237 list-style-image: url("chrome://browser/skin/sidebar-expanded-right.svg"); 238 } 239 } 240 241 &[expanded] { 242 list-style-image: url("chrome://browser/skin/sidebar-expanded-right.svg"); 243 /* stylelint-disable max-nesting-depth */ 244 &:hover { 245 list-style-image: url("chrome://browser/skin/sidebar-collapsed-right.svg"); 246 } 247 } 248 } 249 } 250 } 251 252 #panic-button { 253 list-style-image: url("chrome://browser/skin/forget.svg"); 254 } 255 256 #panic-button[open] { 257 fill: light-dark(rgb(213, 32, 20), #ff848b); 258 } 259 260 #library-button { 261 list-style-image: url("chrome://browser/skin/library.svg"); 262 } 263 264 /* Bookmark toolbar buttons and menu items */ 265 266 .bookmark-item { 267 --bookmark-item-icon: url("chrome://global/skin/icons/defaultFavicon.svg"); 268 --menuitem-icon: var(--bookmark-item-icon); 269 -moz-context-properties: fill; 270 fill: currentColor; 271 272 &:is(toolbarbutton) { 273 -moz-context-properties: fill, fill-opacity; 274 fill: var(--toolbarbutton-icon-fill); 275 list-style-image: var(--bookmark-item-icon); 276 } 277 278 &[container], 279 &[hostContainer] { 280 --bookmark-item-icon: url("chrome://global/skin/icons/folder.svg"); 281 } 282 283 &[query] { 284 --bookmark-item-icon: url("chrome://browser/skin/places/folder-smart.svg"); 285 } 286 287 &[tagContainer] { 288 --bookmark-item-icon: url("chrome://browser/skin/places/tag.svg"); 289 } 290 291 &[dayContainer] { 292 --bookmark-item-icon: url("chrome://browser/skin/history.svg"); 293 } 294 } 295 296 /* Apply crisp rendering for favicons at exactly 2x resolution */ 297 @media (resolution: 2x) { 298 :is(.bookmark-item, .menuitem-with-favicon) > .menu-icon, 299 .bookmark-item > .toolbarbutton-icon { 300 image-rendering: -moz-crisp-edges; 301 } 302 } 303 304 #import-button { 305 list-style-image: url("chrome://browser/skin/import.svg"); 306 } 307 308 #aboutwelcome-button { 309 list-style-image: url("chrome://browser/skin/circle-check-dotted.svg"); 310 } 311 312 #firefox-view-button { 313 list-style-image: url("chrome://browser/skin/firefox-view.svg"); 314 } 315 316 .content-analysis-indicator { 317 -moz-context-properties: fill, stroke; 318 stroke: var(--toolbarbutton-icon-fill); 319 list-style-image: url("chrome://global/skin/icons/content-analysis.svg"); 320 } 321 322 #fxms-bmb-button { 323 list-style-image: url("chrome://branding/content/about-logo.png"); 324 } 325 326 #ipprotection-button { 327 list-style-image: url("chrome://browser/content/logos/ipprotection-off.svg"); 328 -moz-context-properties: fill, stroke, fill-opacity; 329 330 &.ipprotection-on { 331 list-style-image: url("chrome://browser/content/logos/ipprotection-on.svg"); 332 stroke: var(--icon-color-success); 333 } 334 335 &.ipprotection-error { 336 list-style-image: url("chrome://browser/content/logos/ipprotection-error.svg"); 337 stroke: var(--icon-color-critical); 338 } 339 } 340 341 #taskbar-tabs-favicon { 342 margin: auto 8px; 343 height: var(--icon-size); 344 width: var(--icon-size); 345 346 :root:not([taskbartab]) & { 347 display: none; 348 } 349 } 350 351 #taskbar-tabs-audio { 352 /* This is only visible in Taskbar Tabs windows; see ':root[taskbartab] toolbar' in 353 * toolbarbuttons.css. */ 354 display: none; 355 356 &[soundplaying] { 357 list-style-image: url("chrome://global/skin/media/audio.svg"); 358 } 359 360 &[muted] { 361 list-style-image: url("chrome://global/skin/media/audio-muted.svg"); 362 } 363 }