diff options
Diffstat (limited to 'browser/themes/shared')
-rw-r--r-- | browser/themes/shared/browser-shared.css | 14 | ||||
-rw-r--r-- | browser/themes/shared/controlcenter/panel.css | 88 | ||||
-rw-r--r-- | browser/themes/shared/customizableui/panelUI-shared.css | 91 | ||||
-rw-r--r-- | browser/themes/shared/formautofill-notification.css | 5 | ||||
-rw-r--r-- | browser/themes/shared/icons/circle-check-dotted.svg | 4 | ||||
-rw-r--r-- | browser/themes/shared/icons/pin-12.svg | 5 | ||||
-rw-r--r-- | browser/themes/shared/jar.inc.mn | 1 | ||||
-rw-r--r-- | browser/themes/shared/migration/migration-wizard.css | 30 | ||||
-rw-r--r-- | browser/themes/shared/places/editBookmarkPanel.css | 11 | ||||
-rw-r--r-- | browser/themes/shared/preferences/preferences.css | 28 | ||||
-rw-r--r-- | browser/themes/shared/toolbarbutton-icons.css | 4 | ||||
-rw-r--r-- | browser/themes/shared/toolbarbuttons.css | 1 | ||||
-rw-r--r-- | browser/themes/shared/translations/panel.css | 66 | ||||
-rw-r--r-- | browser/themes/shared/urlbar-dynamic-results.css | 7 | ||||
-rw-r--r-- | browser/themes/shared/urlbarView.css | 66 |
15 files changed, 215 insertions, 206 deletions
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 @@ +<!-- 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" width="16" height="16" fill="none"><g clip-path="url(#a)"><g fill="#000" clip-path="url(#b)"><path d="M7.18 10.944h.002l.397-.008a.372.372 0 0 0 .26-.114L12.3 6.203a.718.718 0 0 0-.02-1.021.742.742 0 0 0-1.022.02l-3.912 4.05-2.203-2.12a.72.72 0 0 0-.997 1.046l2.769 2.663a.372.372 0 0 0 .265.104ZM1.092 4.587l.634.392a.373.373 0 0 0 .522-.138c.12-.22.24-.415.368-.598a.37.37 0 0 0-.11-.527l-.63-.39a.373.373 0 0 0-.503.105c-.15.218-.288.44-.41.661a.37.37 0 0 0 .129.495ZM2.435 11.65a.37.37 0 0 0-.041-.291 6.436 6.436 0 0 1-.33-.62.372.372 0 0 0-.513-.169l-.657.352a.37.37 0 0 0-.16.486c.11.23.234.46.37.685a.372.372 0 0 0 .494.136l.654-.35a.371.371 0 0 0 .183-.23ZM3.131 3.028a.372.372 0 0 0 .538.05c.174-.154.36-.3.552-.435a.371.371 0 0 0 .078-.533l-.46-.583a.372.372 0 0 0-.508-.072 7.978 7.978 0 0 0-.611.482.37.37 0 0 0-.048.509l.46.582ZM1.517 9.535a.371.371 0 0 0 .061-.286 6.562 6.562 0 0 1-.101-.695.37.37 0 0 0-.423-.334l-.736.106a.37.37 0 0 0-.316.402c.024.256.061.515.11.77a.372.372 0 0 0 .419.296l.736-.106c.1-.015.19-.07.25-.153ZM5.116 1.67a.371.371 0 0 0 .488.229c.237-.092.456-.165.667-.221a.372.372 0 0 0 .257-.475L6.295.5a.372.372 0 0 0-.45-.242c-.249.068-.498.15-.742.243a.37.37 0 0 0-.22.462l.233.706ZM.355 7.143l.727.151a.376.376 0 0 0 .288-.058.37.37 0 0 0 .156-.25c.033-.221.082-.452.144-.686a.37.37 0 0 0-.284-.458L.658 5.69a.372.372 0 0 0-.436.27 8.027 8.027 0 0 0-.158.761.37.37 0 0 0 .291.42ZM3.373 12.588a.372.372 0 0 0-.54.016l-.494.553a.37.37 0 0 0 .016.511c.19.187.385.361.58.52a.37.37 0 0 0 .511-.042l.496-.554a.37.37 0 0 0-.045-.536 6.578 6.578 0 0 1-.524-.468ZM5.884 14.146a6.482 6.482 0 0 1-.652-.262.373.373 0 0 0-.501.2l-.277.69a.37.37 0 0 0 .191.475c.236.107.48.204.725.288a.372.372 0 0 0 .465-.213l.276-.689a.37.37 0 0 0-.227-.489Z"/><path d="M15.975 7.455a.381.381 0 0 0 0-.066 8.037 8.037 0 0 0-.067-.541l-.01-.08a2.289 2.289 0 0 0-.02-.148.35.35 0 0 0-.018-.067 7.917 7.917 0 0 0-.54-1.76.376.376 0 0 0-.029-.095 6.757 6.757 0 0 0-.219-.429l-.028-.053-.018-.035-.031-.061a1.91 1.91 0 0 0-.06-.114.342.342 0 0 0-.062-.078 8.033 8.033 0 0 0-1.12-1.47.383.383 0 0 0-.04-.05l-.044-.041a3.21 3.21 0 0 0-.118-.11l-.14-.13a5.444 5.444 0 0 0-.269-.248.362.362 0 0 0-.05-.036 8.05 8.05 0 0 0-1.56-1.005.378.378 0 0 0-.08-.052 2.155 2.155 0 0 0-.136-.058l-.073-.03a7.958 7.958 0 0 0-.315-.131l-.068-.03a2.014 2.014 0 0 0-.126-.051.347.347 0 0 0-.08-.02A7.974 7.974 0 0 0 7.98 0a.371.371 0 0 0-.372.37v.198l-.026.534a.37.37 0 0 0 .103.274c.07.074.177.123.27.115.231 0 .47.01.703.034a.338.338 0 0 0 .073 0 6.487 6.487 0 0 1 3.556 1.587c.117.102.233.205.344.317a6.533 6.533 0 0 1 1.883 4.573 6.534 6.534 0 0 1-.155 1.396 6.554 6.554 0 0 1-4.43 4.826l-.036.012a6.533 6.533 0 0 1-1.808.284c-.023-.005-.053-.005-.07-.006-.239.003-.47-.011-.702-.035a.37.37 0 0 0-.41.35l-.036.74a.371.371 0 0 0 .335.388c.231.023.465.036.696.038.027.006.054.01.082.01.626 0 1.27-.082 1.916-.241a.369.369 0 0 0 .082-.012 1.99 1.99 0 0 0 .123-.037l.064-.02c.123-.035.244-.072.364-.112l.066-.02c.043-.012.085-.024.127-.04a.35.35 0 0 0 .078-.039 8.003 8.003 0 0 0 1.67-.857.391.391 0 0 0 .042-.025c.079-.054.155-.114.231-.173l.178-.136a4.094 4.094 0 0 0 .249-.198c.464-.395.888-.85 1.261-1.356a.374.374 0 0 0 .075-.077c.028-.04.053-.08.079-.121l.073-.113c.094-.138.188-.276.27-.42a.34.34 0 0 0 .037-.093 7.947 7.947 0 0 0 .714-1.698.37.37 0 0 0 .024-.063 1.98 1.98 0 0 0 .03-.13l.015-.069a8.59 8.59 0 0 0 .127-.559.34.34 0 0 0 .005-.062 7.86 7.86 0 0 0 .12-1.332c0-.184-.013-.366-.026-.547Z"/></g></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath><clipPath id="b"><path fill="#fff" d="M0 0h16v16.004H0z"/></clipPath></defs></svg> 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 @@ <!-- 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 12 12" width="12" height="12" fill-opacity="context-fill-opacity"> - <path fill="context-fill" d="m9.05 4.055-1.45 0-.444-.165c0 0-.966-.964-1.544-1.541l.494-.494a.5.5 0 1 0-.708-.708l-.709.708-3.542 3.543a.5.5 0 1 0 .708.708l.494-.494c.581.582 1.555 1.558 1.555 1.558l.15.427.001 1.452a.922.922 0 0 0 .926.926.92.92 0 0 0 .653-.272l1.68-1.68 2.83 2.83a.5.5 0 1 0 .708-.708l-2.83-2.83 1.68-1.68a.923.923 0 0 0 .201-1.008.918.918 0 0 0-.853-.572z"/> +<svg width="12" height="12" viewBox="0 0 12 12" fill-opacity="context-fill-opacity" xmlns="http://www.w3.org/2000/svg"> + <path d="M5.39904 1.15594C5.49334 1.06486 5.61964 1.01447 5.75074 1.01561C5.88183 1.01675 6.00724 1.06933 6.09994 1.16203C6.19265 1.25474 6.24523 1.38014 6.24637 1.51124C6.24751 1.64234 6.19711 1.76864 6.10604 1.86294L5.61304 2.35694C6.19004 2.93194 7.15404 3.89494 7.15404 3.89494L7.59804 4.05994H9.04403C9.22675 4.05951 9.40545 4.11349 9.55736 4.21501C9.70928 4.31652 9.82753 4.46097 9.89704 4.62994C9.9672 4.79856 9.98565 4.98423 9.95004 5.16336C9.91442 5.34249 9.82636 5.50699 9.69703 5.63594L8.02004 7.31294L10.844 10.1369C10.9351 10.2312 10.9855 10.3575 10.9844 10.4886C10.9832 10.6197 10.9306 10.7451 10.8379 10.8379C10.7452 10.9306 10.6198 10.9831 10.4887 10.9843C10.3576 10.9854 10.2313 10.935 10.137 10.8439L7.31304 8.01994L5.63604 9.69694C5.63504 9.69794 5.63504 9.69794 5.63404 9.69894C5.50542 9.82816 5.34122 9.91611 5.16238 9.95155C4.98355 9.987 4.79821 9.96834 4.63004 9.89794C4.46106 9.82843 4.31661 9.71019 4.2151 9.55827C4.11358 9.40636 4.0596 9.22765 4.06004 9.04494L4.05804 7.59394L3.90804 7.16794C3.90804 7.16794 2.93604 6.19294 2.35604 5.61294L1.86304 6.10594C1.76873 6.19702 1.64243 6.24742 1.51133 6.24628C1.38024 6.24514 1.25483 6.19256 1.16213 6.09985C1.06942 6.00715 1.01684 5.88174 1.0157 5.75064C1.01456 5.61955 1.06496 5.49324 1.15604 5.39894L4.69204 1.86294L5.39904 1.15594V1.15594ZM4.69004 0.438944L3.98104 1.14794L0.439035 4.68994C0.157585 4.97192 -0.000488281 5.35404 -0.000488281 5.75244C-0.000488281 6.15085 0.157585 6.53297 0.439035 6.81494C0.683733 7.059 1.00497 7.2114 1.34878 7.24655C1.69259 7.28169 2.03802 7.19744 2.32704 7.00794L3.03504 7.71694L3.05304 7.76894L3.05404 9.04994C3.05404 9.83194 3.52104 10.5299 4.24304 10.8289C4.59456 10.9755 4.98174 11.0142 5.35533 10.9401C5.72891 10.8661 6.07203 10.6825 6.34104 10.4129L7.31404 9.43994L9.43504 11.5609C9.71701 11.8424 10.0991 12.0005 10.4975 12.0005C10.8959 12.0005 11.2781 11.8424 11.56 11.5609C11.8415 11.279 11.9996 10.8968 11.9996 10.4984C11.9996 10.1 11.8415 9.71792 11.56 9.43594L9.44003 7.31394L10.412 6.34194C10.6821 6.07284 10.8661 5.72949 10.9406 5.35554C11.015 4.9816 10.9765 4.59396 10.83 4.24194C10.6848 3.88952 10.438 3.58827 10.121 3.37654C9.80402 3.16481 9.43122 3.05216 9.05004 3.05294H7.78104L7.70904 3.02694L7.00804 2.32694C7.19753 2.03793 7.28178 1.6925 7.24664 1.34869C7.21149 1.00488 7.05909 0.683642 6.81504 0.438944C6.5328 0.157981 6.15078 0.000244141 5.75254 0.000244141C5.3543 0.000244141 4.97227 0.157981 4.69004 0.438944V0.438944Z" fill="context-stroke transparent"/> + <path d="M9.05012 4.055H7.60012L7.15612 3.89C7.15612 3.89 6.19012 2.926 5.61212 2.349L6.10612 1.855C6.15261 1.80851 6.18948 1.75332 6.21464 1.69258C6.2398 1.63184 6.25275 1.56674 6.25275 1.501C6.25275 1.43525 6.2398 1.37015 6.21464 1.30941C6.18948 1.24867 6.15261 1.19349 6.10612 1.147C6.05963 1.10051 6.00444 1.06363 5.9437 1.03847C5.88296 1.01332 5.81786 1.00037 5.75212 1.00037C5.68638 1.00037 5.62128 1.01332 5.56054 1.03847C5.4998 1.06363 5.44461 1.10051 5.39812 1.147L4.68912 1.855L1.14712 5.398C1.10063 5.44449 1.06376 5.49967 1.0386 5.56041C1.01344 5.62115 1.00049 5.68625 1.00049 5.752C1.00049 5.81774 1.01344 5.88284 1.0386 5.94358C1.06376 6.00432 1.10063 6.05951 1.14712 6.106C1.19361 6.15249 1.2488 6.18936 1.30954 6.21452C1.37028 6.23968 1.43538 6.25263 1.50112 6.25263C1.56686 6.25263 1.63196 6.23968 1.6927 6.21452C1.75344 6.18936 1.80863 6.15249 1.85512 6.106L2.34912 5.612C2.93012 6.194 3.90412 7.17 3.90412 7.17L4.05412 7.597L4.05512 9.049C4.05459 9.17075 4.07818 9.2914 4.12453 9.40399C4.17088 9.51657 4.23907 9.61887 4.32516 9.70496C4.41125 9.79105 4.51354 9.85924 4.62613 9.90559C4.73872 9.95194 4.85937 9.97553 4.98112 9.975C5.10253 9.97499 5.22273 9.95095 5.33481 9.90427C5.44688 9.85758 5.54861 9.78918 5.63412 9.703L7.31412 8.023L10.1441 10.853C10.1906 10.8995 10.2458 10.9364 10.3065 10.9615C10.3673 10.9867 10.4324 10.9996 10.4981 10.9996C10.5639 10.9996 10.629 10.9867 10.6897 10.9615C10.7504 10.9364 10.8056 10.8995 10.8521 10.853C10.8986 10.8065 10.9355 10.7513 10.9606 10.6906C10.9858 10.6298 10.9988 10.5647 10.9988 10.499C10.9988 10.4333 10.9858 10.3682 10.9606 10.3074C10.9355 10.2467 10.8986 10.1915 10.8521 10.145L8.02212 7.315L9.70212 5.635C9.83178 5.50584 9.92012 5.34105 9.95591 5.16156C9.9917 4.98208 9.97333 4.79601 9.90312 4.627C9.83415 4.45749 9.71609 4.31247 9.5641 4.21055C9.4121 4.10863 9.23312 4.05446 9.05012 4.055Z" fill="context-fill"/> </svg> 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 */ |