From fbaf0bb26397aa498eb9156f06d5a6fe34dd7dd8 Mon Sep 17 00:00:00 2001 From: Daniel Baumann Date: Fri, 19 Apr 2024 03:14:29 +0200 Subject: Merging upstream version 125.0.1. Signed-off-by: Daniel Baumann --- browser/themes/linux/browser.css | 115 +++++++++++---------- browser/themes/shared/browser-shared.css | 14 --- browser/themes/shared/controlcenter/panel.css | 88 +++++----------- .../shared/customizableui/panelUI-shared.css | 91 ++++++---------- .../themes/shared/formautofill-notification.css | 5 +- .../themes/shared/icons/circle-check-dotted.svg | 4 + browser/themes/shared/icons/pin-12.svg | 5 +- browser/themes/shared/jar.inc.mn | 1 + .../themes/shared/migration/migration-wizard.css | 30 +++++- browser/themes/shared/places/editBookmarkPanel.css | 11 -- browser/themes/shared/preferences/preferences.css | 28 ++--- browser/themes/shared/toolbarbutton-icons.css | 4 + browser/themes/shared/toolbarbuttons.css | 1 + browser/themes/shared/translations/panel.css | 66 +++++++++--- browser/themes/shared/urlbar-dynamic-results.css | 7 +- browser/themes/shared/urlbarView.css | 66 ++++++++---- browser/themes/triage.json | 86 +++++++++++++++ browser/themes/windows/browser.css | 5 - 18 files changed, 359 insertions(+), 268 deletions(-) create mode 100644 browser/themes/shared/icons/circle-check-dotted.svg create mode 100644 browser/themes/triage.json (limited to 'browser/themes') diff --git a/browser/themes/linux/browser.css b/browser/themes/linux/browser.css index eb46a22222..89df26a2f0 100644 --- a/browser/themes/linux/browser.css +++ b/browser/themes/linux/browser.css @@ -214,64 +214,73 @@ * can swallow those events. */ .titlebar-buttonbox { z-index: 1; - align-items: center; + align-items: stretch; } -/* When using lightweight themes, use our own buttons since native ones might - * assume a native background in order to be visible. */ -.titlebar-button:-moz-lwtheme { +@media (-moz-gtk-csd-reversed-placement) { + .titlebar-buttonbox-container { + order: -1; + } +} + +.titlebar-button { appearance: none; - border-radius: 100%; + align-items: center; + padding: 0; + padding-inline: calc(env(-moz-gtk-csd-titlebar-button-spacing) / 2); + + > .toolbarbutton-icon { + appearance: auto; + } + + /* stylelint-disable-next-line media-query-no-invalid */ + @media (-moz-bool-pref: "widget.gtk.non-native-titlebar-buttons.enabled") { + /* When using lightweight themes, use our own buttons since native ones might + * assume a native background in order to be visible. */ + &:-moz-lwtheme { + padding-inline: 3px; + + > .toolbarbutton-icon { + appearance: none; + border-radius: 100%; + background-position: center center; + background-repeat: no-repeat; + -moz-context-properties: stroke; + stroke: currentColor; + /* Roughly the Adwaita size */ + width: 24px; + height: 24px; + } + } + } - &:hover { + &:hover > .toolbarbutton-icon { background-color: color-mix(in srgb, currentColor 12%, transparent); } - &:hover:active { + &:hover:active > .toolbarbutton-icon { background-color: color-mix(in srgb, currentColor 20%, transparent); } - &:focus-visible { + &:focus-visible > .toolbarbutton-icon { outline: var(--focus-outline); outline-offset: var(--focus-outline-inset); } - - > .toolbarbutton-icon { - padding: 6px; - -moz-context-properties: stroke; - stroke: currentColor; - } } -/* Render titlebar command buttons according to system config. - * Use full scale icons here as the Gtk+ does. */ .titlebar-max { - appearance: auto; - -moz-default-appearance: -moz-window-button-maximize; order: env(-moz-gtk-csd-maximize-button-position); - - &:-moz-lwtheme { - list-style-image: url(chrome://browser/skin/window-controls/maximize.svg); + > .toolbarbutton-icon { + -moz-default-appearance: -moz-window-button-maximize; + background-image: url(chrome://browser/skin/window-controls/maximize.svg); } } .titlebar-restore { - appearance: auto; - -moz-default-appearance: -moz-window-button-restore; order: env(-moz-gtk-csd-maximize-button-position); - - &:-moz-lwtheme { - list-style-image: url(chrome://browser/skin/window-controls/restore.svg); - } -} - -@media not (-moz-gtk-csd-minimize-button) { - .titlebar-min { - display: none; - - &:-moz-lwtheme { - list-style-image: url(chrome://browser/skin/window-controls/restore.svg); - } + > .toolbarbutton-icon { + -moz-default-appearance: -moz-window-button-restore; + background-image: url(chrome://browser/skin/window-controls/restore.svg); } } @@ -283,21 +292,20 @@ } .titlebar-close { - appearance: auto; - -moz-default-appearance: -moz-window-button-close; order: env(-moz-gtk-csd-close-button-position); - &:-moz-lwtheme { - list-style-image: url(chrome://browser/skin/window-controls/close.svg); + > .toolbarbutton-icon { + -moz-default-appearance: -moz-window-button-close; + background-image: url(chrome://browser/skin/window-controls/close.svg); + } - &:hover { - background-color: #d70022; - color: white; - } + &:hover > .toolbarbutton-icon { + background-color: #d70022; + color: white; + } - &:hover:active { - background-color: #ff0039; - } + &:hover:active > .toolbarbutton-icon { + background-color: #ff0039; } @media not (-moz-gtk-csd-close-button) { @@ -306,21 +314,14 @@ } .titlebar-min { - appearance: auto; - -moz-default-appearance: -moz-window-button-minimize; order: env(-moz-gtk-csd-minimize-button-position); - &:-moz-lwtheme { - list-style-image: url(chrome://browser/skin/window-controls/minimize.svg); + > .toolbarbutton-icon { + -moz-default-appearance: -moz-window-button-minimize; + background-image: url(chrome://browser/skin/window-controls/minimize.svg); } @media not (-moz-gtk-csd-minimize-button) { display: none; } } - -@media (-moz-gtk-csd-reversed-placement) { - .titlebar-buttonbox-container { - order: -1; - } -} diff --git a/browser/themes/shared/browser-shared.css b/browser/themes/shared/browser-shared.css index 164b54bd85..f708347193 100644 --- a/browser/themes/shared/browser-shared.css +++ b/browser/themes/shared/browser-shared.css @@ -933,20 +933,6 @@ popupnotificationcontent { margin-inline: 0; } -.popup-notification-body :is(input, textarea) { - padding: 8px; - border-radius: 4px; - border: 0; - outline: 1px solid var(--input-border-color, ThreeDShadow); - outline-offset: -1px; - background-color: var(--input-bgcolor, Field); - color: var(--input-color, FieldText); -} - -.popup-notification-body input:focus-visible { - outline: 2px solid var(--focus-outline-color); -} - .popup-notification-description { font-weight: 600; margin-top: 0; diff --git a/browser/themes/shared/controlcenter/panel.css b/browser/themes/shared/controlcenter/panel.css index d7685cdc69..b8ba6b72e4 100644 --- a/browser/themes/shared/controlcenter/panel.css +++ b/browser/themes/shared/controlcenter/panel.css @@ -295,42 +295,8 @@ display: inline; } -#protections-popup-sendReportView-description > label { - display: inline; -} - /* CONTENT BLOCKING / TRACKING PROTECTION */ -#protections-popup-sendReportView-heading, -#protections-popup-sendReportView-body, -#protections-popup-siteNotWorkingView-body { - padding: var(--vertical-section-padding) var(--horizontal-padding); -} - -.protections-popup-sendReportView-collection-section { - margin-bottom: 16px; -} - -#protections-popup-sendReportView-collection-url { - appearance: none; - border: none; - margin: 4px 0; -} - -#protections-popup-sendReportView-collection-comments { - height: 120px; - resize: vertical; -} - -.protections-popup-sendReportView-collection-section label { - margin-bottom: 2px; -} - -#protections-popup-sendReportView-report-error { - margin-bottom: 24px; - color: #d74345; -} - #protections-popup-not-blocking-section-why:hover, #protections-popup-show-report-stack:hover > .protections-popup-footer-button { background-color: var(--panel-item-hover-bgcolor); @@ -402,43 +368,42 @@ /* Content Blocking categories */ -#protections-popup-no-trackers-found-description { - margin: 4.85em 7.25em; - font-size: 1.1em; - text-align: center; - color: var(--text-color-deemphasized); +#tracking-protection-container { + #protections-popup:not([detected]) & { + flex: 0 1 10em; + margin-block: var(--space-medium); + } + + > tooltip { + max-width: var(--popup-width); + } } .protections-popup-section-header { color: var(--text-color-deemphasized); -} -:root[uidensity="compact"] .protections-popup-section-header { - margin-block: 4px; + :root[uidensity="compact"] & { + margin-block: 4px; + } } -#tracking-protection-container > tooltip { - max-width: var(--popup-width); -} -/* - * The category list is split into two sections: "Blocking" and "Not Blocking", - * with five different category items distributed between them at runtime. - * To achieve this, we use a grid layout with 12 rows: one row for each header - * label and five rows in each section for the items. - * Items with the "blocked" class are assigned rows 2-6, and those without - * are assigned rows 8-12, with the headers taking rows 1 and 7. - */ +#protections-popup-no-trackers-found-description { + margin: auto 7.25em; + font-size: 1.1em; + text-align: center; + color: var(--text-color-deemphasized); -#protections-popup-no-trackers-found-description:not([hidden]) ~ #protections-popup-content { - display: none; + &:not([hidden]) ~ #protections-popup-content { + display: none; + } } #protections-popup-not-blocking-section-why { border-radius: 2px; -} -#protections-popup-not-blocking-section-why:hover { - outline: 4px solid var(--panel-item-hover-bgcolor); + &:hover { + outline: 4px solid var(--panel-item-hover-bgcolor); + } } .trackers-icon { @@ -574,10 +539,6 @@ font-weight: 600; } -#protections-popup-siteNotWorkingView-body-issue-list { - padding-inline-start: 1em; -} - /* Protection popup footer categories */ #protections-popup-trackers-blocked-counter-box { @@ -684,8 +645,7 @@ } .protections-popup-section-header, -.protections-popup-switch-section-header, -#protections-popup-siteNotWorkingView-header { +.protections-popup-switch-section-header { padding: var(--arrowpanel-menuitem-padding); margin: var(--arrowpanel-menuitem-margin); } diff --git a/browser/themes/shared/customizableui/panelUI-shared.css b/browser/themes/shared/customizableui/panelUI-shared.css index 4f282b9d5a..51ab66b25a 100644 --- a/browser/themes/shared/customizableui/panelUI-shared.css +++ b/browser/themes/shared/customizableui/panelUI-shared.css @@ -2085,67 +2085,6 @@ panelview { resize: vertical; } - select { - /* copied/adapted from toolkit/themes/shared/menulist-shared.css */ - appearance: none; - background-color: var(--button-bgcolor, ButtonFace); - color: var(--button-color, ButtonText); - border-radius: 4px; - padding: 6px 16px; - margin: 5px 2px 3px; - - font: menu; - font-weight: 600; - border: none; - - background-image: url(chrome://global/skin/icons/arrow-down-12.svg); - background-position: right 10px center; - padding-inline-end: 32px; /* 2 * 10px padding + image's 12px width */ - background-repeat: no-repeat; - -moz-context-properties: fill; - fill: currentColor; - - &:-moz-locale-dir(rtl) { - background-position: left 10px center; - } - - &:hover { - background-color: var(--button-hover-bgcolor, color-mix(in srgb, currentColor 10%, ButtonFace)); - } - - &:hover:active { - background-color: var(--button-active-bgcolor, color-mix(in srgb, currentColor 20%, ButtonFace)); - } - - &:focus-visible { - outline: var(--focus-outline); - outline-offset: var(--focus-outline-offset); - } - } - - input, - textarea { - appearance: none; - background-color: var(--panel-background); - padding: 0.25em; - border: 1px solid var(--panel-separator-color); - border-radius: 4px; - - &:focus-visible { - border-color: transparent; - outline: var(--focus-outline); - outline-offset: var(--focus-outline-offset); - } - } - - input:user-invalid:not(:focus-visible), - select:user-invalid:not(:focus-visible) { - border-color: transparent; - outline: var(--focus-outline); - outline-offset: var(--focus-outline-offset); - outline-color: var(--color-error-outline); - } - > .panel-subview-body > label { margin-block: 1.5em 0.5em; @@ -2211,3 +2150,33 @@ panelview { #report-broken-site-panel-container { padding: 8px 16px 16px; } + +/* ----- Profiles panels ----- */ + +#profiles-edit-this-delete-button { + list-style-image: url("chrome://global/skin/icons/edit.svg"); +} + +#profiles-delete-this-profile-button { + list-style-image: url("chrome://global/skin/icons/delete.svg"); +} + +#profile-icon-image { + width: 75px; + height: 75px; +} + +#profile-name { + font-size: 1.667rem; + padding-block-start: var(--space-medium); +} + +#this-profile-buttons { + justify-content: center; +} + +#current-profile { + align-items: center; + padding: var(--space-xxlarge) 0 var(--space-medium); + gap: var(--space-small); +} diff --git a/browser/themes/shared/formautofill-notification.css b/browser/themes/shared/formautofill-notification.css index aefef93517..918f977d74 100644 --- a/browser/themes/shared/formautofill-notification.css +++ b/browser/themes/shared/formautofill-notification.css @@ -103,9 +103,10 @@ display: flex; flex-direction: row; - > p { + > h1 { + font-size: 1em; padding-block: 8px 4px; - font-weight: var(--font-weight-bold); + margin-block: 0; } } diff --git a/browser/themes/shared/icons/circle-check-dotted.svg b/browser/themes/shared/icons/circle-check-dotted.svg new file mode 100644 index 0000000000..b498d1282e --- /dev/null +++ b/browser/themes/shared/icons/circle-check-dotted.svg @@ -0,0 +1,4 @@ + + diff --git a/browser/themes/shared/icons/pin-12.svg b/browser/themes/shared/icons/pin-12.svg index 2c354bdfa4..9fe0c3ffa0 100644 --- a/browser/themes/shared/icons/pin-12.svg +++ b/browser/themes/shared/icons/pin-12.svg @@ -1,6 +1,7 @@ - - + + + diff --git a/browser/themes/shared/jar.inc.mn b/browser/themes/shared/jar.inc.mn index 37b5f04cdd..14a5efecac 100644 --- a/browser/themes/shared/jar.inc.mn +++ b/browser/themes/shared/jar.inc.mn @@ -160,6 +160,7 @@ skin/classic/browser/canvas-blocked.svg (../shared/icons/canvas-blocked.svg) skin/classic/browser/characterEncoding.svg (../shared/icons/characterEncoding.svg) skin/classic/browser/chevron-animation.svg (../shared/icons/chevron-animation.svg) + skin/classic/browser/circle-check-dotted.svg (../shared/icons/circle-check-dotted.svg) skin/classic/browser/customize.svg (../shared/icons/customize.svg) skin/classic/browser/device-phone.svg (../shared/icons/device-phone.svg) skin/classic/browser/device-tablet.svg (../shared/icons/device-tablet.svg) diff --git a/browser/themes/shared/migration/migration-wizard.css b/browser/themes/shared/migration/migration-wizard.css index 457af1f66e..060133613a 100644 --- a/browser/themes/shared/migration/migration-wizard.css +++ b/browser/themes/shared/migration/migration-wizard.css @@ -13,9 +13,9 @@ } h1 { - font-size: 1.30em; - font-weight: normal; - margin-block: 0 16px; + font-size: var(--embedded-wizard-header-font-size, 1.30em); + font-weight: var(--embedded-wizard-header-font-weight, normal); + margin-block: var(--embedded-wizard-header-margin-block, 0 16px); min-height: 1em; } @@ -157,13 +157,17 @@ div[name="page-selection"]:not([show-import-all]) summary { } div[name="page-selection"][show-import-all]:not([single-item]) label:not(#select-all) { - margin-inline-start: 24px; + margin-inline: var(--resource-type-label-margin-inline, 24px 0); } div[name="page-selection"][show-import-all] #select-all { display: flex; } +div[name="page-selection"][show-import-all][hide-select-all] #select-all { + display: none; +} + div[name="page-selection"][migrator-type="browser"] > .buttons > #import-from-file, div[name="page-selection"][migrator-type="browser"][no-permissions] > .buttons > #import, div[name="page-selection"][migrator-type="browser"]:not([no-permissions]) > .buttons > #get-permissions, @@ -217,7 +221,8 @@ summary { } #resource-type-list > label { - margin-block-start: 16px; + margin-block: var(--resource-type-label-margin-block, 16px 0); + margin-inline: var(--resource-type-label-margin-inline, 0); } :host(:not([dialog-mode])) .cancel-close, @@ -382,3 +387,18 @@ div[name="page-selection"][show-import-all] .resource-selection-details { "c b"; margin-block: 16px 0; } + +:host([hide-option-expander-subtitle]) .selected-data { + display: none; +} + +p.migration-wizard-subheader { + font-size: var(--embedded-wizard-subheader-font-size, .85em); + font-weight: var(--embedded-wizard-subheader-font-weight, 400); + margin-block: var(--embedded-wizard-subheader-margin-block, 0 28px); + line-height: 1.2em; + + &[hidden] { + display: none; + } +} diff --git a/browser/themes/shared/places/editBookmarkPanel.css b/browser/themes/shared/places/editBookmarkPanel.css index 64840f1cf1..4602e43cd9 100644 --- a/browser/themes/shared/places/editBookmarkPanel.css +++ b/browser/themes/shared/places/editBookmarkPanel.css @@ -126,17 +126,6 @@ margin: 0; } -#editBookmarkPanelContent > html|input, -#editBookmarkPanelContent > hbox > html|input { - appearance: none; - padding: 8px; - border-radius: 4px; - border: 1px solid var(--input-border-color, ThreeDShadow); - background-color: var(--input-bgcolor, Field); - color: var(--input-color, FieldText); - margin: 0; -} - /* Focus outlines */ #editBookmarkPanel .expander-up:focus-visible, diff --git a/browser/themes/shared/preferences/preferences.css b/browser/themes/shared/preferences/preferences.css index 2461212bba..8f2652f030 100644 --- a/browser/themes/shared/preferences/preferences.css +++ b/browser/themes/shared/preferences/preferences.css @@ -195,7 +195,7 @@ radio { */ .subcategory:not([hidden]) ~ .subcategory { - padding-top: var(--space-xlarge); + padding-top: var(--space-xxlarge); border-top: 1px solid var(--in-content-border-color); } @@ -596,7 +596,7 @@ a[is="moz-support-link"]:not(.sidebar-footer-link) { } html|dialog { - padding: 24px; + padding: var(--space-xlarge); } html|dialog::backdrop, @@ -717,7 +717,7 @@ html|dialog, border-radius: 50%; border: 1px solid transparent; list-style-image: url(chrome://browser/skin/fxa/avatar-color.svg); - margin-inline-end: 24px; + margin-inline-end: var(--space-xlarge); -moz-user-focus: normal; } @@ -803,7 +803,7 @@ html|dialog, } .sync-group { - margin-block: 16px; + margin-block: var(--space-large); border: 1px solid var(--in-content-border-color); } @@ -818,7 +818,7 @@ html|dialog, .sync-engines-list > div, .sync-engines-list + hbox { margin-top: 0; - padding-top: 16px; + padding-top: var(--space-large); max-width: 300px; height: auto; } @@ -961,7 +961,7 @@ dialog > .sync-engines-list + hbox { } #policies-container { - margin-inline-end: 16px; + margin-inline-end: var(--space-large); /* Make sure the container is at least the same height as the searchbox. This is needed in addition to the min-height above to make the info icon the same height as the first line in the policies label. @@ -1217,11 +1217,11 @@ richlistitem .text-link:hover { } #pane-experimental-featureGates { - margin-top: 16px; + margin-top: var(--space-large); } .featureGate { - margin-bottom: 16px; + margin-bottom: var(--space-large); } .featureGateCheckbox { @@ -1251,7 +1251,7 @@ richlistitem .text-link:hover { } #moreFromMozillaCategory-header .subtitle { - margin-block-end: 24px; + margin-block-end: var(--space-xlarge); } #moreFromMozillaCategory:not([hidden]) { @@ -1358,7 +1358,7 @@ richlistitem .text-link:hover { } .simple .qr-code-box { - padding-inline: 24px; + padding-inline: var(--space-xlarge); padding-block: 20px } @@ -1387,13 +1387,13 @@ richlistitem .text-link:hover { #web-appearance-chooser { display: flex; justify-content: space-between; - gap: 16px; + gap: var(--space-large); } #web-appearance-chooser, #web-appearance-override-warning, #text-zoom-override-warning { - margin: 12px 0; + margin: var(--space-medium) 0; } #web-appearance-override-warning:not([hidden]) { @@ -1411,7 +1411,7 @@ richlistitem .text-link:hover { .web-appearance-choice-image-container { background-color: var(--in-content-button-background); - padding: 12px 0; + padding: var(--space-medium) 0; } .web-appearance-choice:hover > .web-appearance-choice-image-container { @@ -1477,7 +1477,7 @@ richlistitem .text-link:hover { #translations-manage-error { color: var(--text-color-error); - margin: 16px 0; + margin: var(--space-large) 0; } .hidden-category { diff --git a/browser/themes/shared/toolbarbutton-icons.css b/browser/themes/shared/toolbarbutton-icons.css index acbc0e9630..3879689f12 100644 --- a/browser/themes/shared/toolbarbutton-icons.css +++ b/browser/themes/shared/toolbarbutton-icons.css @@ -464,6 +464,10 @@ toolbarbutton.bookmark-item { list-style-image: url("chrome://browser/skin/import.svg"); } +#aboutwelcome-button { + list-style-image: url("chrome://browser/skin/circle-check-dotted.svg"); +} + #firefox-view-button { list-style-image: url("chrome://browser/skin/firefox-view.svg"); } diff --git a/browser/themes/shared/toolbarbuttons.css b/browser/themes/shared/toolbarbuttons.css index f535fba9df..7af8b2227d 100644 --- a/browser/themes/shared/toolbarbuttons.css +++ b/browser/themes/shared/toolbarbuttons.css @@ -263,6 +263,7 @@ toolbarbutton.bookmark-item:not(.subviewbutton) { #bookmarks-toolbar-placeholder > .toolbarbutton-icon, #PlacesToolbarItems > .bookmark-item > .toolbarbutton-icon[label]:not([label=""]), #PersonalToolbar #import-button > .toolbarbutton-icon, +#PersonalToolbar #aboutwelcome-button > .toolbarbutton-icon, #OtherBookmarks.bookmark-item[container] > .toolbarbutton-icon { margin-inline-end: 4px; } diff --git a/browser/themes/shared/translations/panel.css b/browser/themes/shared/translations/panel.css index b7e961846d..6777e37cc3 100644 --- a/browser/themes/shared/translations/panel.css +++ b/browser/themes/shared/translations/panel.css @@ -7,7 +7,7 @@ width: 31em; } -:where(#translations-panel) :is(description, label, menulist) { +:where(#full-page-translations-panel) :is(description, label, menulist) { margin: 0; } @@ -42,11 +42,12 @@ h1.translations-panel-header-wrapper { } } -#translations-panel-intro { +#full-page-translations-panel-intro { line-height: 1.6; + margin-block-end: var(--arrowpanel-padding); } -#translations-panel-settings > image { +.translations-panel-settings-gear-icon > image { /* Override the panel-info-button with a gear icon. */ list-style-image: url(chrome://global/skin/icons/settings.svg); } @@ -54,10 +55,9 @@ h1.translations-panel-header-wrapper { .translations-panel-content { padding: var(--arrowpanel-padding); padding-block-end: 8px; - gap: var(--arrowpanel-padding); } -#translations-panel-lang-selection > label { +#full-page-translations-panel-lang-selection > label { margin-block: var(--arrowpanel-padding) 6px; } @@ -68,7 +68,7 @@ h1.translations-panel-header-wrapper { background-color: var(--button-primary-bgcolor); } -#translations-panel-translate-hint-action { +#full-page-translations-panel-translate-hint-action { appearance: none; background-color: var(--button-bgcolor); border-radius: 4px; @@ -77,25 +77,25 @@ h1.translations-panel-header-wrapper { font-size: 0.9em; } -#translations-panel-translate-hint-action:hover { +#full-page-translations-panel-translate-hint-action:hover { background-color: var(--button-hover-bgcolor); } -#translations-panel-translate-hint-action:hover:active { +#full-page-translations-panel-translate-hint-action:hover:active { background-color: var(--button-active-bgcolor); } -#translations-panel-translate-hint-action:focus-visible { +#full-page-translations-panel-translate-hint-action:focus-visible { outline: var(--focus-outline); outline-offset: var(--focus-outline-offset); } -#translations-panel-error-message-hint { +#full-page-translations-panel-error-message-hint { margin-inline-start: 21px; margin-block: 8px; } -#translations-panel-error-message { +#full-page-translations-panel-error-message { font-weight: 600; } @@ -111,8 +111,50 @@ h1.translations-panel-header-wrapper { align-items: start; } -#translations-panel-error { +#full-page-translations-panel-error { border: 1px solid currentColor; border-radius: 4px; padding: 12px; } + +.select-translations-panel-button { + align-items: center; + justify-content: center; + margin-inline: 0; +} + +.select-translations-panel-content { + padding: var(--arrowpanel-padding); + padding-block: 4px; +} + +.select-translations-panel-copy-button { + background-color: transparent; + font: message-box; + font-weight: var(--font-weight-bold); + &::before { + content: url(chrome://global/skin/icons/edit-copy.svg); + fill: currentColor; + margin-inline-end: 5px; + -moz-context-properties: fill; + } +} + +.select-translations-panel-header { + padding: var(--arrowpanel-padding); + text-align: initial; +} + +.select-translations-panel-label { + margin-inline: 2px; +} + +#select-translations-panel-lang-selection { + gap: 6px; +} + +#select-translations-panel-translation-area { + height: 8em; + margin-inline: 5px; + resize: none; +} diff --git a/browser/themes/shared/urlbar-dynamic-results.css b/browser/themes/shared/urlbar-dynamic-results.css index 6f14177ace..e634b701f6 100644 --- a/browser/themes/shared/urlbar-dynamic-results.css +++ b/browser/themes/shared/urlbar-dynamic-results.css @@ -242,10 +242,14 @@ } } - /** * Weather */ + +.urlbarView-row[dynamicType=weather] > .urlbarView-row-inner { + align-items: center; +} + .urlbarView-dynamic-weather-currentConditions { color: var(--urlbar-box-text-color); background-color: var(--urlbar-box-focus-bgcolor); @@ -403,7 +407,6 @@ } .urlbarView-results[wrap] > .urlbarView-row[dynamicType=weather] > .urlbarView-row-inner { - align-items: center; flex-wrap: nowrap; > .urlbarView-dynamic-weather-summary > .urlbarView-dynamic-weather-top { diff --git a/browser/themes/shared/urlbarView.css b/browser/themes/shared/urlbarView.css index 84982637b7..ee8ee15c2a 100644 --- a/browser/themes/shared/urlbarView.css +++ b/browser/themes/shared/urlbarView.css @@ -18,10 +18,10 @@ --urlbarView-action-color: LinkText; --urlbarView-action-slide-in-distance: 200px; - --urlbarView-row-gutter: 2px; - --urlbarView-small-font-size: 0.85em; + --urlbarView-results-padding: 4px; + --urlbarView-row-gutter: 2px; --urlbarView-item-inline-padding: var(--urlbar-icon-padding); --urlbarView-item-block-padding: 6px; @@ -48,6 +48,10 @@ --urlbarView-result-button-hover-color: var(--toolbar-field-focus-background-color); --urlbarView-result-button-hover-background-color: color-mix(in srgb, var(--toolbar-field-focus-color) var(--urlbarView-result-button-background-opacity), transparent); + --urlbarView-labeled-row-margin-top: calc(1.46em + 4px); + --urlbarView-labeled-row-label-top: calc(-1.27em - 2px); + --urlbarView-labeled-tip-margin-top-extra: 8px; + &:-moz-locale-dir(rtl) { --urlbarView-action-slide-in-distance: -200px; } @@ -94,7 +98,7 @@ } .urlbarView-results { - padding-block: 4px; + padding-block: var(--urlbarView-results-padding); white-space: nowrap; /* Vertically center the one-offs when no results are present. */ @@ -142,12 +146,22 @@ color: var(--urlbarView-highlight-color); } - :root:not([uidensity=compact]) &:not([type=tip], [type=dynamic]) { - min-height: 32px; + &:not([type=tip], [type=dynamic]) { + :root:not([uidensity=compact]) & { + min-height: 32px; + } + :root[uidensity=touch] & { + padding-block: 11px; + } } - :root[uidensity=touch] &:not([type=tip], [type=dynamic]) { - padding-block: 11px; + &[rich-suggestion][type=search] { + :root:not([uidensity=compact]) & { + min-height: 46px; + } + :root[uidensity=touch] & { + padding-block: 4px; + } } } @@ -438,6 +452,7 @@ .urlbarView-row[type=tip] { padding-block: 18px; + border-block: 0; border-radius: 0; &:not(:last-child) { @@ -450,6 +465,14 @@ margin-top: 4px; } + /* For tips with row labels, move the entire row down by an additional + var(--urlbarView-labeled-tip-margin-top-extra) so there's more space + between the tip's top border and the label. They're too close otherwise. + The row label must also be adjusted; see the row label rules. */ + &[label] { + margin-top: calc(var(--urlbarView-labeled-row-margin-top) + var(--urlbarView-labeled-tip-margin-top-extra)); + } + > .urlbarView-row-inner { min-height: 32px; align-items: center; @@ -493,6 +516,10 @@ &[tip-type=dismissalAcknowledgment] { padding-block: 6px; + + &:last-child { + padding-block-end: max(0px, 6px - var(--urlbarView-results-padding)); + } } } @@ -503,7 +530,7 @@ position: relative; /* `margin-block-start` controls how far the main part of the row is from the main part of the previous row. */ - margin-block-start: calc(1.46em + 4px); + margin-block-start: var(--urlbarView-labeled-row-margin-top); &::before { content: attr(label); @@ -512,7 +539,7 @@ selection and hover states. */ position: absolute; /* `top` controls how far the label is from the main part of the row. */ - top: calc(-1.27em - 2px); + top: var(--urlbarView-labeled-row-label-top); margin-inline-start: var(--urlbarView-item-inline-padding); font-size: 0.8em; /* The color and opacity of labels is the same as the "This time, search with" @@ -523,6 +550,16 @@ pointer-events: none; } + /* For tips with row labels, the entire row is moved down by an additional + var(--urlbarView-labeled-tip-margin-top-extra) so there's more space + between the tip's top border and the label; see the tip rules. Here we + compensate so that the label remains the same distance from the previous + row as it would have had we not moved the tip row down. +1px compensates + for the tip's top 1px border. */ + &[type=tip]::before { + top: calc(var(--urlbarView-labeled-row-label-top) - var(--urlbarView-labeled-tip-margin-top-extra) + 1px); + } + :root[lwt-toolbar-field-focus="dark"] &::before { /* Same as `.search-panel-header > label` in searchbar.css */ opacity: 1; @@ -568,11 +605,8 @@ .urlbarView-userContext-icon { height: 14px; - background-image: var(--identity-icon); + width: 14px; -moz-context-properties: fill; - background-size: contain; - background-repeat: no-repeat; - background-position: center center; vertical-align: top; margin-inline-start: 0.35em; } @@ -880,12 +914,6 @@ .urlbarView-row[type$=_yelp][icon-size="38"] > .urlbarView-row-inner > .urlbarView-favicon { padding: calc((52px - 38px) / 2); - border: 1px solid var(--urlbar-box-focus-bgcolor); - border-radius: 2px; -} - -.urlbarView-row[type$=_yelp][icon-size="38"]:is([selected], :hover) > .urlbarView-row-inner > .urlbarView-favicon { - border-color: var(--urlbarView-result-button-selected-background-color); } /* Search one-offs */ diff --git a/browser/themes/triage.json b/browser/themes/triage.json new file mode 100644 index 0000000000..30ef62e34f --- /dev/null +++ b/browser/themes/triage.json @@ -0,0 +1,86 @@ +{ + "triagers": { + "Amy Churchwell": { + "bzmail": "achurchwell@mozilla.com" + }, + "Cieara Meador": { + "bzmail": "cmeador@mozilla.com" + }, + "Dão Gottwald": { + "bzmail": "dao+bmo@mozilla.com" + }, + "Jules Simplicio": { + "bzmail": "jules@mozilla.com" + }, + "Kelly Cochrane": { + "bzmail": "kcochrane@mozilla.com" + }, + "Sam Foster": { + "bzmail": "sfoster@mozilla.com" + } + }, + "duty-start-dates": { + "2024-03-01": "Amy Churchwell", + "2024-03-08": "Cieara Meador", + "2024-03-15": "Dão Gottwald", + "2024-03-22": "Jules Simplicio", + "2024-03-29": "Kelly Cochrane", + "2024-04-06": "Sam Foster", + "2024-04-13": "Amy Churchwell", + "2024-04-20": "Cieara Meador", + "2024-04-27": "Dão Gottwald", + "2024-05-04": "Jules Simplicio", + "2024-05-11": "Kelly Cochrane", + "2024-05-18": "Sam Foster", + "2024-05-25": "Amy Churchwell", + "2024-06-02": "Cieara Meador", + "2024-06-09": "Dão Gottwald", + "2024-06-16": "Jules Simplicio", + "2024-06-23": "Kelly Cochrane", + "2024-06-30": "Sam Foster", + "2024-07-07": "Amy Churchwell", + "2024-07-14": "Cieara Meador", + "2024-07-21": "Dão Gottwald", + "2024-07-28": "Jules Simplicio", + "2024-08-05": "Kelly Cochrane", + "2024-08-12": "Sam Foster", + "2024-08-19": "Amy Churchwell", + "2024-08-26": "Cieara Meador", + "2024-09-03": "Dão Gottwald", + "2024-09-10": "Jules Simplicio", + "2024-09-17": "Kelly Cochrane", + "2024-09-24": "Sam Foster", + "2024-10-01": "Amy Churchwell", + "2024-10-08": "Cieara Meador", + "2024-10-15": "Dão Gottwald", + "2024-10-22": "Jules Simplicio", + "2024-10-29": "Kelly Cochrane", + "2024-11-06": "Sam Foster", + "2024-11-13": "Amy Churchwell", + "2024-11-20": "Cieara Meador", + "2024-11-27": "Dão Gottwald", + "2024-12-04": "Jules Simplicio", + "2024-12-11": "Kelly Cochrane", + "2024-12-18": "Sam Foster", + "2024-12-25": "Amy Churchwell", + "2025-01-02": "Cieara Meador", + "2025-01-09": "Dão Gottwald", + "2025-01-16": "Jules Simplicio", + "2025-01-23": "Kelly Cochrane", + "2025-01-30": "Sam Foster", + "2025-02-07": "Amy Churchwell", + "2025-02-14": "Cieara Meador", + "2025-02-21": "Dão Gottwald", + "2025-02-28": "Jules Simplicio", + "2025-03-05": "Kelly Cochrane", + "2025-03-12": "Sam Foster", + "2025-03-19": "Amy Churchwell", + "2025-03-26": "Cieara Meador", + "2025-04-03": "Dão Gottwald", + "2025-04-10": "Jules Simplicio", + "2025-04-17": "Kelly Cochrane", + "2025-04-24": "Sam Foster", + "2025-05-01": "Amy Churchwell", + "2025-05-08": "Cieara Meador" + } +} diff --git a/browser/themes/windows/browser.css b/browser/themes/windows/browser.css index 5698fb3d99..c4c2f814c7 100644 --- a/browser/themes/windows/browser.css +++ b/browser/themes/windows/browser.css @@ -61,11 +61,6 @@ height: calc(var(--tab-min-height) - var(--tabs-navbar-shadow-size)); } -#print-preview-toolbar:not(:-moz-lwtheme) { - appearance: auto; - -moz-default-appearance: toolbox; -} - /* Titlebar */ .titlebar-buttonbox { -- cgit v1.2.3