Bug 1422100 - Refactor in-content UI font sizes. r?jaws
MozReview-Commit-ID: DIxgLYcUvJh
--- a/browser/themes/linux/preferences/in-content/dialog.css
+++ b/browser/themes/linux/preferences/in-content/dialog.css
@@ -1,13 +1,10 @@
/* - 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/. */
%include ../../../shared/incontentprefs/dialog.inc.css
-label,
-textbox,
-description,
-.tab-text,
-menulist label {
- font-size: 1.11rem;
+:root > * {
+ font-size: 1.05em;
}
+
--- a/browser/themes/linux/preferences/in-content/preferences.css
+++ b/browser/themes/linux/preferences/in-content/preferences.css
@@ -1,45 +1,23 @@
/* - 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/. */
%include ../../../shared/incontentprefs/preferences.inc.css
-html *,
-page *,
-window * {
- font-size: 1.11rem;
-}
-
-caption label {
- font-size: 1.27rem;
-}
-
-.tip-caption,
-.help-label {
- font-size: 1rem;
+:root > * {
+ font-size: 1.11em;
}
.treecol-sortdirection {
/* override the Linux only toolkit rule */
-moz-appearance: none;
}
-.actionsMenu {
- font-family: "Clear Sans", sans-serif;
- font-size: 1.25rem;
- line-height: 22px;
-}
-
.actionsMenu > .menulist-label-box > .menulist-icon {
- margin-top: 1px;
margin-inline-start: 1px;
- margin-inline-end: 6px;
-}
-
-.actionsMenu > .menulist-label-box > .menulist-label {
- margin-top: 2px !important;
+ margin-inline-end: 8px;
}
filefield + button {
margin-inline-start: -4px;
}
--- a/browser/themes/osx/preferences/in-content/dialog.css
+++ b/browser/themes/osx/preferences/in-content/dialog.css
@@ -4,22 +4,18 @@
%include ../../../shared/incontentprefs/dialog.inc.css
prefwindow,
.windowDialog {
font: message-box !important;
}
-label,
-textbox,
-description,
-.tab-text,
-menulist label {
- font-size: 1.36rem;
+:root > * {
+ font-size: 1.18em;
}
caption {
font: message-box;
}
.prefWindow-dlgbuttons {
margin: 0;
--- a/browser/themes/osx/preferences/in-content/preferences.css
+++ b/browser/themes/osx/preferences/in-content/preferences.css
@@ -1,27 +1,16 @@
/* - 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/. */
%include ../../../shared/incontentprefs/preferences.inc.css
-html *,
-page *,
-window * {
- font-size: 1.36rem;
-}
-
-caption label {
- font-size: 1.55rem;
-}
-
-.tip-caption,
-.help-label {
- font-size: 1.18rem;
+:root > * {
+ font-size: 1.36em;
}
.actionsMenu > .menulist-label-box > .menulist-icon {
margin-top: 2px;
margin-inline-start: 2px;
margin-inline-end: 8px !important;
}
--- a/browser/themes/shared/incontentprefs/dialog.inc.css
+++ b/browser/themes/shared/incontentprefs/dialog.inc.css
@@ -45,33 +45,27 @@ tree:not(#rejectsTree) {
margin: 3px 0 0 !important;
}
caption {
padding-inline-start: 0;
}
groupbox {
- font-size: 1em;
margin-top: 0;
margin-right: 4px;
margin-left: 4px;
padding-top: 0;
padding-bottom: 5px;
}
prefpane .groupbox-body {
padding: 0 0 5px;
}
groupbox description {
margin-right: 0;
margin-left: 0;
}
-label.menu-text,
-textbox.tree-input {
- font-size: unset;
-}
-
menulist label {
font-weight: unset;
}
--- a/browser/themes/shared/incontentprefs/preferences.inc.css
+++ b/browser/themes/shared/incontentprefs/preferences.inc.css
@@ -21,18 +21,16 @@
/* A workaround to keep the container always float on the `top: 0` (Bug 1377009) */
display: block;
width: 664px;
}
#mainPrefPane {
width: 100%;
padding: 0;
- font: message-box;
- color: currentColor;
}
prefpane > groupbox + groupbox {
margin-top: 16px;
}
groupbox + groupbox > .groupbox-body,
groupbox + vbox groupbox > .groupbox-body {
@@ -52,21 +50,25 @@ button,
treecol,
html|option {
/* override the * rule */
-moz-user-select: none;
}
description,
label {
- line-height: 30px;
+ line-height: 1.8em;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
+.tip-caption {
+ font-size: .9em;
+}
+
menulist > hbox > label,
menuitem > label,
button > hbox > label {
line-height: unset;
}
.indent {
margin-inline-start: 28px !important;
@@ -206,22 +208,20 @@ button > hbox > label {
}
#browserHomePage:-moz-locale-dir(rtl) input {
unicode-bidi: plaintext;
direction: rtl;
}
#updateApp > .groupbox-body > label {
- margin: 0 0 4px 0;
- line-height: 30px;
+ margin: 0 0 4px;
}
#updateApp > .groupbox-body > description {
- line-height: 30px;
margin: 0;
}
#updateBox {
margin-top: 4px;
margin-bottom: 32px;
}
@@ -241,17 +241,17 @@ button > hbox > label {
#updateRadioGroup > radio,
#browserStartupPage > radio {
height: 30px;
margin: 2px 0;
}
#filter {
- margin: 4px 0 8px 0;
+ margin: 4px 0 8px;
}
#handlersView {
height: 25em;
margin-inline-end: 0;
}
#handlersView > richlistitem {
@@ -285,17 +285,17 @@ button > hbox > label {
.actionsMenu > menupopup > menuitem > .menu-iconic-left {
margin-inline-end: 8px !important;
}
/* Search Pane */
#engineList {
- margin: 2px 0 5px 0;
+ margin: 2px 0 5px;
}
#engineList > treechildren::-moz-tree-image(engineShown, checked),
#blocklistsTree > treechildren::-moz-tree-image(selectionCol, checked) {
list-style-image: url("chrome://global/skin/in-content/check.svg");
-moz-context-properties: fill, stroke;
fill: #2292d0;
stroke: none;
@@ -314,17 +314,17 @@ button > hbox > label {
min-height: 36px;
}
#selectionCol {
min-width: 26px;
}
#addEnginesBox {
- margin: 4px 0 0 0;
+ margin: 4px 0 0;
}
/* Privacy Pane */
#formAutofillGroup {
margin-top: 28px;
}
@@ -407,17 +407,16 @@ button > hbox > label {
.dialogOverlay[topmost="true"] {
background-color: rgba(0,0,0,0.5);
}
.dialogBox {
background-color: #fbfbfb;
background-clip: content-box;
color: #424e5a;
- font-size: 14px;
/* `transparent` will use the dialogText color in high-contrast themes and
when page colors are disabled */
border: 1px solid transparent;
border-radius: 3.5px;
box-shadow: 0 2px 6px 0 rgba(0,0,0,0.3);
display: -moz-box;
margin: 0;
padding: 0;
@@ -433,17 +432,17 @@ button > hbox > label {
.dialogBox > .groupbox-title {
margin-top: 0;
padding: 3.5px 0;
background-color: #F1F1F1;
border-bottom: 1px solid #C1C1C1;
}
.dialogTitle {
- font-size: unset;
+ font-size: .9em;
text-align: center;
-moz-user-select: none;
}
.close-icon {
border: none;
background: none !important;
min-width: 0;
@@ -678,17 +677,17 @@ button > hbox > label {
}
.help-icon:hover {
fill: currentColor !important;
}
.help-label {
margin: 0 4px;
- line-height: 22px;
+ font-size: .9em;
-moz-user-select: none;
}
@media (max-width: 830px) {
.help-button > .text-link {
-moz-box-flex: 0;
width: 36px;
height: 36px;
--- a/browser/themes/windows/preferences/in-content/dialog.css
+++ b/browser/themes/windows/preferences/in-content/dialog.css
@@ -1,13 +1,9 @@
/* - 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/. */
%include ../../../shared/incontentprefs/dialog.inc.css
-label,
-textbox,
-description,
-.tab-text,
-menulist label {
- font-size: 1.25rem;
+:root > * {
+ font-size: 1.12em;
}
--- a/browser/themes/windows/preferences/in-content/preferences.css
+++ b/browser/themes/windows/preferences/in-content/preferences.css
@@ -1,27 +1,16 @@
/* - 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/. */
%include ../../../shared/incontentprefs/preferences.inc.css
-html *,
-page *,
-window * {
- font-size: 1.25rem;
-}
-
-caption label {
- font-size: 1.42rem;
-}
-
-.tip-caption,
-.help-label {
- font-size: 1.08rem;
+:root > * {
+ font-size: 1.25em;
}
.actionsMenu > .menulist-label-box > .menulist-icon {
margin-inline-end: 9px;
}
filefield + button {
margin-inline-start: -4px;
--- a/toolkit/themes/linux/global/in-content/common.css
+++ b/toolkit/themes/linux/global/in-content/common.css
@@ -96,20 +96,12 @@ xul|treechildren::-moz-tree-row(multicol
xul|treechildren::-moz-tree-row(hover) {
background-color: var(--in-content-item-hover);
}
xul|treechildren::-moz-tree-row(selected) {
background-color: var(--in-content-item-selected);
}
-*|*.header-name {
- font-size: 1.64rem;
-}
-
-*|*.category-name {
- font-size: 1.19rem;
-}
-
html|button {
/* XUL button min-width */
min-width: 6.3em;
}
--- a/toolkit/themes/linux/mozapps/extensions/extensions.css
+++ b/toolkit/themes/linux/mozapps/extensions/extensions.css
@@ -1,14 +1,18 @@
/* 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/. */
%include ../../../shared/extensions/extensions.inc.css
+:root > * {
+ font-size: 1.11em;
+}
+
#header-utils-btn .toolbarbutton-icon {
list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg");
-moz-context-properties: fill;
fill: GrayText;
}
.sorter[checkState="1"] .button-icon {
display: -moz-box;
--- a/toolkit/themes/osx/global/in-content/common.css
+++ b/toolkit/themes/osx/global/in-content/common.css
@@ -57,21 +57,16 @@ xul|*.radio-icon {
margin-inline-end: 0;
}
xul|*.numberbox-input-box {
-moz-appearance: none;
border-width: 0;
}
-xul|description {
- font-size: 1.25rem;
- line-height: 22px;
-}
-
xul|*.text-link:-moz-focusring {
color: var(--in-content-link-highlight);
text-decoration: underline;
box-shadow: none;
}
xul|button:-moz-focusring,
xul|menulist:-moz-focusring,
@@ -111,20 +106,12 @@ xul|*.spinbuttons-button > xul|*.button-
display: none;
}
xul|textbox[type="search"]:not([searchbutton]) > .textbox-input-box > .textbox-search-sign {
list-style-image: url(chrome://global/skin/icons/search-textbox.svg);
margin-inline-end: 5px;
}
-*|*.header-name {
- font-size: 2rem;
-}
-
-*|*.category-name {
- font-size: 1.45rem;
-}
-
html|button {
/* XUL button min-width */
min-width: 79px;
}
--- a/toolkit/themes/osx/mozapps/extensions/extensions.css
+++ b/toolkit/themes/osx/mozapps/extensions/extensions.css
@@ -1,14 +1,18 @@
/* 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/. */
%include ../../../shared/extensions/extensions.inc.css
+:root > * {
+ font-size: 1.36em;
+}
+
.no-auto-hide > .menulist-dropmarker {
padding-inline-start: 0px !important;
}
#header-utils-btn {
list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg");
-moz-context-properties: fill;
fill: #424f5a;
--- a/toolkit/themes/shared/in-content/common.inc.css
+++ b/toolkit/themes/shared/in-content/common.inc.css
@@ -68,24 +68,25 @@ html|h1 {
html|hr {
border-style: solid none none none;
border-color: var(--in-content-border-color);
}
xul|caption {
-moz-appearance: none;
+ font-size: 1.14em;
margin: 0;
}
html|h2,
xul|caption xul|checkbox,
xul|caption xul|label {
font-weight: 600;
- line-height: 22px;
+ line-height: 1.4em;
}
xul|caption xul|checkbox,
xul|caption xul|label {
margin: 0 !important;
}
*|*.main-content {
@@ -99,17 +100,16 @@ xul|prefpane > xul|*.content-box {
/* groupboxes */
xul|groupbox {
-moz-appearance: none;
border: none;
margin: 0;
padding: 0;
- font-size: 1.25rem;
}
xul|groupbox > xul|caption {
padding: 4px 0;
}
xul|groupbox xul|label:not(.menu-accel):not(.menu-text):not(.indent):not(.learnMore):not(.tail-with-learn-more),
xul|groupbox xul|description {
@@ -117,18 +117,16 @@ xul|groupbox xul|description {
margin-inline-start: 0 !important;
margin-inline-end: 0 !important;
}
/* tabpanels and tabs */
xul|tabpanels {
-moz-appearance: none;
- font-size: 1.25rem;
- line-height: 22px;
border: none;
padding: 0;
background-color: transparent;
color: inherit;
}
xul|tabs {
margin-bottom: 15px;
@@ -160,21 +158,16 @@ xul|tab:hover {
}
xul|tab[selected] {
background-color: var(--in-content-box-background-hover);
padding-bottom: 0; /* compensate the 4px border */
border-bottom: 4px solid var(--in-content-border-highlight);
}
-xul|*.tab-text {
- font-size: 1.3rem;
- line-height: 22px;
-}
-
/* html buttons */
html|button {
padding: 3px;
}
/* xul buttons and menulists */
@@ -698,17 +691,18 @@ xul|*.radio-label-box {
background-color: var(--in-content-category-background-selected-active);
}
*|*#categories[keyboard-navigation="true"]:-moz-focusring > *|*.category[current] {
outline: var(--in-content-category-outline-focus);
}
*|*.category-name {
- line-height: 22px;
+ font-size: 1.07em;
+ line-height: 1.4em;
padding-bottom: 2px;
padding-inline-start: 9px;
margin: 0;
-moz-user-select: none;
}
*|*.category-icon {
width: 24px;
@@ -751,18 +745,19 @@ xul|*.radio-label-box {
*|*.header {
margin-inline-end: 4px; /* add the 4px end-margin of other elements */
margin-bottom: 15px;
padding-bottom: 15px;
-moz-box-align: baseline;
}
*|*.header-name {
+ font-size: 1.46em;
font-weight: 300;
- line-height: 30px;
+ line-height: 1.3em;
margin: 0;
-moz-user-select: none;
}
/* File fields */
xul|filefield {
-moz-appearance: none;
--- a/toolkit/themes/windows/global/in-content/common.css
+++ b/toolkit/themes/windows/global/in-content/common.css
@@ -50,20 +50,12 @@ html|input[type="checkbox"]:-moz-focusri
an existing high-contrast border that uses the background color */
@media (-moz-windows-default-theme: 0) {
xul|treechildren::-moz-tree-row(selected),
xul|listbox xul|listitem[selected="true"] {
border: 2px dotted Highlight;
}
}
-*|*.header-name {
- font-size: 1.83rem;
-}
-
-*|*.category-name {
- font-size: 1.33rem;
-}
-
html|button {
/* XUL button min-width */
min-width: 6.3em;
}
--- a/toolkit/themes/windows/mozapps/extensions/extensions.css
+++ b/toolkit/themes/windows/mozapps/extensions/extensions.css
@@ -1,14 +1,18 @@
/* 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/. */
%include ../../../shared/extensions/extensions.inc.css
+:root > * {
+ font-size: 1.25em;
+}
+
#header-utils-btn {
list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg");
-moz-context-properties: fill;
fill: #424f5a;
margin-inline-end: 16px;
}
@media (-moz-windows-default-theme: 0) {