Bug 1493961 - Font editor: replace capitalization via CSS text-transform with manual capitalization where needed. r=gl

Localization means words in other languages that shouldn't be capitalized will be if using CSS text-transform.

Differential Revision: https://phabricator.services.mozilla.com/D7190

--HG--
extra : moz-landing-system : lando

devtools/client/inspector/fonts/components/FontEditor.js

@@ -107,7 +107,7 @@ class FontEditor extends PureComponent {
         {
           className: "font-control-label",
         },
-        getStr("fontinspector.usedFontsLabel")
+        getStr("fontinspector.fontsUsedLabel")
       ),
       dom.div(
         {

devtools/client/inspector/fonts/components/LineHeight.js

@@ -62,7 +62,7 @@ class LineHeight extends PureComponent {
 
     return FontPropertyValue({
       autoIncrement: true,
-      label: getStr("fontinspector.lineHeightLabel"),
+      label: getStr("fontinspector.lineHeightLabelCapitalized"),
       min: 0,
       max: this.historicMax[unit],
       name: "line-height",

devtools/client/locales/en-US/font-inspector.properties

@@ -57,16 +57,16 @@ fontinspector.showLess=Show less
 # selected element is a pseudo-element that the font editor cannot work with.
 fontinspector.noPseduoWarning=Pseudo-elements are not currently supported.
 
-# LOCALIZATION NOTE (fontinspector.lineHeightLabel): Label for the UI to change the line height in the font editor.
-fontinspector.lineHeightLabel=Line height
+# LOCALIZATION NOTE (fontinspector.lineHeightLabelCapitalized): Label for the UI to change the line height in the font editor.
+fontinspector.lineHeightLabelCapitalized=Line Height
 
 # LOCALIZATION NOTE (fontinspector.allFontsOnPageHeader): Header for the section listing
 # all the fonts on the current page.
 fontinspector.allFontsOnPageHeader=All fonts on page
 
-# LOCALIZATION NOTE (fontinspector.usedFontsLabel): Label for the Font Editor section
+# LOCALIZATION NOTE (fontinspector.fontsUsedLabel): Label for the Font Editor section
 # which shows the fonts used on the selected element.
-fontinspector.usedFontsLabel=Fonts used
+fontinspector.fontsUsedLabel=Fonts Used
 
 # LOCALIZATION NOTE (fontinspector.previewTextPlaceholder): Placeholder for the input
 # where the user can type text to get a preview of it using a font.

devtools/client/themes/fonts.css

@@ -225,7 +225,6 @@
   font-size: 12px;
   min-width: 70px;
   margin-right: 10px;
-  text-transform: capitalize;
   -moz-user-select: none;
 }
 
@@ -239,7 +238,6 @@
 .font-control-label-detail {
   color: var(--secondary-label-color);
   font-size: smaller;
-  text-transform: none;
 }
 
 .font-value-input {