Bug 1392532 - Polish Preferences font size depending on platforms r?dao
MozReview-Commit-ID: IiqSSl7wQ6h
--- a/browser/components/preferences/in-content/main.xul
+++ b/browser/components/preferences/in-content/main.xul
@@ -905,17 +905,17 @@
<hbox align="center">
<checkbox id="useRecommendedPerformanceSettings"
label="&useRecommendedPerformanceSettings2.label;"
accesskey="&useRecommendedPerformanceSettings2.accesskey;"
preference="browser.preferences.defaultPerformanceSettings.enabled"/>
<label id="performanceSettingsLearnMore" class="learnMore text-link">&performanceSettingsLearnMore.label;</label>
</hbox>
- <description class="indent">&useRecommendedPerformanceSettings2.description;</description>
+ <description class="indent tip-caption">&useRecommendedPerformanceSettings2.description;</description>
<vbox id="performanceSettings" class="indent" hidden="true">
<checkbox id="allowHWAccel"
label="&allowHWAccel.label;"
accesskey="&allowHWAccel.accesskey;"
preference="layers.acceleration.disabled"/>
<hbox align="center">
<label id="limitContentProcess" accesskey="&limitContentProcessOption.accesskey;" control="contentProcessCount">&limitContentProcessOption.label;</label>
@@ -926,18 +926,18 @@
<menuitem label="3" value="3"/>
<menuitem label="4" value="4"/>
<menuitem label="5" value="5"/>
<menuitem label="6" value="6"/>
<menuitem label="7" value="7"/>
</menupopup>
</menulist>
</hbox>
- <description id="contentProcessCountEnabledDescription">&limitContentProcessOption.description;</description>
- <description id="contentProcessCountDisabledDescription">&limitContentProcessOption.disabledDescription;<label class="text-link" href="https://wiki.mozilla.org/Electrolysis">&limitContentProcessOption.disabledDescriptionLink;</label></description>
+ <description id="contentProcessCountEnabledDescription" class="tip-caption">&limitContentProcessOption.description;</description>
+ <description id="contentProcessCountDisabledDescription" class="tip-caption">&limitContentProcessOption.disabledDescription;<label class="text-link" href="https://wiki.mozilla.org/Electrolysis">&limitContentProcessOption.disabledDescriptionLink;</label></description>
</vbox>
</groupbox>
<hbox id="browsingCategory"
class="subcategory"
hidden="true"
data-category="paneGeneral">
<label class="header-name" flex="1">&browsing.label;</label>
--- a/browser/components/preferences/in-content/preferences.xul
+++ b/browser/components/preferences/in-content/preferences.xul
@@ -175,17 +175,17 @@
<key key="&focusSearch1.key;" modifiers="accel" id="focusSearch1" oncommand="gSearchResultsPane.searchInput.focus();"/>
</keyset>
<html:a class="help-button" target="_blank" aria-label="&helpButton2.label;">&helpButton2.label;</html:a>
<vbox class="main-content" flex="1" align="start">
<vbox class="pane-container">
<hbox class="search-container" pack="end">
- <textbox type="search" id="searchInput" hidden="true" clickSelectsAll="true"/>
+ <textbox type="search" id="searchInput" style="width: &searchField.width;" hidden="true" clickSelectsAll="true"/>
</hbox>
<prefpane id="mainPrefPane">
#include searchResults.xul
#include main.xul
#include search.xul
#include privacy.xul
#include containers.xul
#include sync.xul
--- a/browser/components/preferences/in-content/privacy.xul
+++ b/browser/components/preferences/in-content/privacy.xul
@@ -697,17 +697,17 @@
</description>
<description flex="1">
<checkbox id="submitHealthReportBox" label="&enableHealthReport1.label;"
accesskey="&enableHealthReport1.accesskey;"/>
<label id="FHRLearnMore"
class="learnMore text-link">&healthReportLearnMore.label;</label>
</description>
#ifndef MOZ_TELEMETRY_REPORTING
- <description id="TelemetryDisabledDesc" class="indent" control="telemetryGroup">&healthReportingDisabled.label;</description>
+ <description id="TelemetryDisabledDesc" class="indent tip-caption" control="telemetryGroup">&healthReportingDisabled.label;</description>
#endif
</vbox>
#ifdef MOZ_CRASHREPORTER
<hbox align="center">
<checkbox id="automaticallySubmitCrashesBox"
preference="browser.crashReports.unsubmittedCheck.autoSubmit"
label="&alwaysSubmitCrashReports1.label;"
accesskey="&alwaysSubmitCrashReports1.accesskey;"/>
--- a/browser/components/preferences/in-content/sync.xul
+++ b/browser/components/preferences/in-content/sync.xul
@@ -40,31 +40,31 @@
data-category="paneSync">
<label class="header-name" flex="1">&paneSync1.title;</label>
</hbox>
<deck id="weavePrefsDeck" data-category="paneSync" hidden="true">
<groupbox id="noFxaAccount">
<hbox>
<vbox flex="1">
- <label id="noFxaCaption">&signedOut.caption;</label>
+ <caption><label id="noFxaCaption">&signedOut.caption;</label></caption>
<description id="noFxaDescription" flex="1">&signedOut.description;</description>
</vbox>
<vbox>
<image class="fxaSyncIllustration"/>
</vbox>
</hbox>
<hbox id="fxaNoLoginStatus" align="center" flex="1">
<vbox>
<image class="fxaProfileImage"/>
</vbox>
<vbox flex="1">
<hbox align="center" flex="1">
<hbox align="center" flex="1">
- <label id="signedOutAccountBoxTitle">&signedOut.accountBox.title;</label>
+ <caption><label id="signedOutAccountBoxTitle">&signedOut.accountBox.title;</label></caption>
</hbox>
<button id="noFxaSignIn"
class="accessory-button"
label="&signedOut.accountBox.signin2;"
accesskey="&signedOut.accountBox.signin2.accesskey;"/>
</hbox>
<hbox align="center" flex="1">
<html:a id="noFxaSignUp"
@@ -99,18 +99,18 @@
<!-- logged in and verified and all is good -->
<hbox id="fxaLoginVerified" align="center" flex="1">
<image class="fxaProfileImage actionable"
role="button"
onclick="gSyncPane.openChangeProfileImage(event);"
onkeypress="gSyncPane.openChangeProfileImage(event);"
tooltiptext="&profilePicture.tooltip;"/>
<vbox flex="1" pack="center">
- <hbox flex="1" align="center">
- <label id="fxaDisplayName" hidden="true"/>
+ <hbox flex="1" align="baseline">
+ <caption><label id="fxaDisplayName" hidden="true"/></caption>
<label class="fxaEmailAddress" flex="1" crop="end"/>
<button id="fxaUnlinkButton"
class="accessory-button"
label="&disconnect3.label;"
accesskey="&disconnect3.accesskey;"/>
</hbox>
<hbox>
<html:a id="verifiedManage" class="openLink"
--- a/browser/locales/en-US/chrome/browser/preferences/preferences.dtd
+++ b/browser/locales/en-US/chrome/browser/preferences/preferences.dtd
@@ -8,16 +8,21 @@
<!-- LOCALIZATION NOTE (prefWindow.titleGNOME): This is not used for in-content preferences -->
<!ENTITY prefWindow.titleGNOME "&brandShortName; Preferences">
<!-- When making changes to prefWindow.styleWin test both Windows Classic and
Luna since widget heights are different based on the OS theme -->
<!ENTITY prefWinMinSize.styleWin2 "width: 42em; min-height: 37.5em;">
<!ENTITY prefWinMinSize.styleMac "width: 47em; min-height: 40em;">
<!ENTITY prefWinMinSize.styleGNOME "width: 45.5em; min-height: 40.5em;">
+<!-- LOCALIZATION NOTE: (searchField.width): This is used to determine the width
+ of the search field in about:preferences, in order to make entire placeholder
+ string visible -->
+<!ENTITY searchField.width "15.4em">
+
<!ENTITY paneSearchResults.title "Search Results">
<!ENTITY paneGeneral.title "General">
<!ENTITY paneSearch.title "Search">
<!ENTITY paneFilesApplications.title "Files & Applications">
<!ENTITY panePrivacySecurity.title "Privacy & Security">
<!ENTITY paneContainers.title "Container Tabs">
<!ENTITY paneUpdates.title "Updates">
--- a/browser/themes/shared/incontentprefs/preferences.inc.css
+++ b/browser/themes/shared/incontentprefs/preferences.inc.css
@@ -25,41 +25,29 @@
#mainPrefPane {
width: 100%;
padding: 0;
font: message-box;
color: currentColor;
}
-#mainPrefPane groupbox,
-#mainPrefPane deck,
-#mainPrefPane description {
- font-size: 1.36rem;
-}
-
groupbox + groupbox {
margin-top: 16px;
}
groupbox + groupbox > .groupbox-body,
groupbox + vbox groupbox > .groupbox-body {
margin-top: 4px;
}
.groupbox-title {
margin-top: 16px;
}
-input,
-description.indent,
-.indent > description {
- font-size: 1.18rem !important;
-}
-
description.indent,
.indent > description {
color: #737373;
}
button,
treecol,
html|option {
@@ -114,21 +102,16 @@ separator.thin:not([orient="vertical"])
*/
.subcategory:not([hidden]) ~ .subcategory {
margin-top: 32px;
padding-top: 15px;
border-top: 1px solid rgba(12, 12, 13, 0.15);
}
-.header-name {
- font-size: 2rem;
- font-weight: 300;
-}
-
/* Category List */
#category-general > .category-icon {
list-style-image: url("chrome://browser/skin/preferences/in-content/general.svg");
}
#category-search > .category-icon {
list-style-image: url("chrome://browser/skin/preferences/in-content/search.svg");
@@ -149,16 +132,21 @@ separator.thin:not([orient="vertical"])
justify-content: space-between;
}
.header[hidden=true] {
display: none;
}
/* General Pane */
+
+#isDefaultLabel {
+ font-weight: 600;
+}
+
#startupPageBox {
padding-top: 32px;
}
#browserHomePage {
margin-inline-start: 0;
margin-inline-end: 0;
}
@@ -170,21 +158,16 @@ separator.thin:not([orient="vertical"])
.homepage-button:last-of-type {
margin-inline-end: 0;
}
#getStarted {
font-size: 90%;
}
-#isNotDefaultLabel,
-#signedOutAccountBoxTitle {
- font-weight: 600;
-}
-
#downloadFolder {
margin-inline-start: 0;
}
#browserHomePage:-moz-locale-dir(rtl) input {
unicode-bidi: plaintext;
direction: rtl;
}
@@ -498,17 +481,16 @@ separator.thin:not([orient="vertical"])
margin-bottom: 0;
}
#tosPP-small-ToS {
margin-bottom: 14px;
}
#noFxaCaption {
- font-weight: bold;
line-height: 30px;
margin-top: 0;
margin-bottom: 4px;
}
#noFxaSignIn {
margin-inline-start: 8px;
}
@@ -526,31 +508,26 @@ separator.thin:not([orient="vertical"])
.separator {
border-bottom: 1px solid var(--in-content-box-border-color);
}
#fxaGroup {
margin-bottom: 32px;
}
-#signedOutAccountBoxTitle {
- font-weight: bold;
-}
-
.openLink {
line-height: 30px;
cursor: pointer;
}
.openLink:visited {
color: var(--in-content-link-color);
}
#fxaDisplayName {
- font-weight: bold;
margin-inline-end: 10px !important;
}
.fxaEmailAddress {
margin-inline-end: 8px !important;
}
.fxaLoginRejectedWarning {
@@ -605,17 +582,16 @@ separator.thin:not([orient="vertical"])
.help-button {
position: fixed;
left: 0;
bottom: 36px;
background-image: url("chrome://global/skin/icons/help.svg");
-moz-context-properties: fill, fill-opacity;
fill: currentColor;
- font-size: 13px;
line-height: 36px;
height: 36px;
width: 168px;
background-position: left 10px top 10px;
background-size: 16px;
padding-inline-start: 38px;
margin-inline-start: 34px;
white-space: nowrap;
@@ -660,17 +636,16 @@ separator.thin:not([orient="vertical"])
position: sticky;
background-color: var(--in-content-page-background);
width: 100%;
top: 0;
z-index: 1;
}
#searchInput {
- width: 250px;
margin: 20px 0 30px 0;
}
#searchInput .textbox-search-icons:not([selectedIndex="1"]) {
display: none;
}
.search-tooltip {
--- a/toolkit/themes/linux/global/in-content/common.css
+++ b/toolkit/themes/linux/global/in-content/common.css
@@ -101,19 +101,41 @@ xul|spinbuttons {
-moz-appearance: none;
}
xul|treechildren::-moz-tree-row(multicol, odd) {
background-color: var(--in-content-box-background-odd);
}
/* These rules are duplicated from common.inc.css
- * because above -moz-tree-row(multicol, odd) rule
- * overrides also hover/selected states.
+ * because above -moz-tree-row(multicol, odd) rule
+ * overrides also hover/selected states.
*/
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);
}
+html|html *,
+xul|page *,
+xul|window * {
+ font-size: 1.11rem;
+}
+
+*|*.header-name {
+ font-size: 1.64rem;
+}
+
+*|*.category-name {
+ font-size: 1.19rem;
+}
+
+xul|caption > xul|label {
+ font-size: 1.27rem;
+}
+
+.tip-caption,
+.help-button {
+ font-size: 1rem;
+}
--- a/toolkit/themes/osx/global/in-content/common.css
+++ b/toolkit/themes/osx/global/in-content/common.css
@@ -72,17 +72,16 @@ xul|*.radio-icon {
}
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;
}
@@ -125,8 +124,30 @@ 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;
}
+html|html *,
+xul|page *,
+xul|window * {
+ font-size: 1.36rem;
+}
+
+*|*.header-name {
+ font-size: 2rem;
+}
+
+*|*.category-name {
+ font-size: 1.45rem;
+}
+
+xul|caption > xul|label {
+ font-size: 1.55rem;
+}
+
+.tip-caption,
+.help-button {
+ font-size: 1.18rem;
+}
--- a/toolkit/themes/shared/in-content/common.inc.css
+++ b/toolkit/themes/shared/in-content/common.inc.css
@@ -74,18 +74,17 @@ html|hr {
xul|caption {
-moz-appearance: none;
margin: 0;
}
html|h2,
xul|caption > xul|checkbox,
xul|caption > xul|label {
- font-size: 1.3rem;
- font-weight: bold;
+ font-weight: 600;
line-height: 22px;
}
xul|caption > xul|checkbox,
xul|caption > xul|label {
margin: 0 !important;
}
@@ -687,17 +686,16 @@ xul|*.radio-label-box {
*|*#categories[keyboard-navigation="true"]:-moz-focusring > *|*.category[current] {
border: var(--in-content-category-border-focus);
border-inline-start: none;
}
*|*.category-name {
line-height: 22px;
- font-size: 1.45rem;
padding-bottom: 2px;
padding-inline-start: 9px;
margin: 0;
-moz-user-select: none;
}
*|*.category-icon {
width: 24px;
@@ -748,17 +746,16 @@ 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: 2rem;
font-weight: 300;
line-height: 30px;
margin: 0;
-moz-user-select: none;
}
/* File fields */
--- a/toolkit/themes/windows/global/in-content/common.css
+++ b/toolkit/themes/windows/global/in-content/common.css
@@ -72,8 +72,31 @@ html|input[type="checkbox"]:-moz-focusri
/* Use a 2px border so that selected row highlight is still visible behind
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;
}
}
+
+html|html *,
+xul|page *,
+xul|window * {
+ font-size: 1.25rem;
+}
+
+*|*.header-name {
+ font-size: 1.83rem;
+}
+
+*|*.category-name {
+ font-size: 1.33rem;
+}
+
+xul|caption > xul|label {
+ font-size: 1.42rem;
+}
+
+.tip-caption,
+.help-button {
+ font-size: 1.08rem;
+}