Bug 1525615: Change the style of basic font-size and font-weight. r=jdescottes,ladybenko
authorDaisuke Akatsuka <dakatsuka@mozilla.com>
Tue, 26 Feb 2019 12:45:18 +0000
changeset 518953 b309d8c1cfa9857e81320e741cc3db325d364a09
parent 518952 2aedb2fbe8e1f8e05c8d4db7cbcadef29b162750
child 518954 c58658cd01ef0145a5471811796dfc3b64a7de5e
push id10862
push userffxbld-merge
push dateMon, 11 Mar 2019 13:01:11 +0000
treeherdermozilla-beta@a2e7f5c935da [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjdescottes, ladybenko
bugs1525615
milestone67.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1525615: Change the style of basic font-size and font-weight. r=jdescottes,ladybenko Depends on D20294 Differential Revision: https://phabricator.services.mozilla.com/D20295
devtools/client/aboutdebugging-new/src/base.css
devtools/client/aboutdebugging-new/src/components/App.css
--- a/devtools/client/aboutdebugging-new/src/base.css
+++ b/devtools/client/aboutdebugging-new/src/base.css
@@ -39,29 +39,31 @@
   --grey-90-a10: rgba(12, 12, 13, 0.1);
   --grey-90-a20: rgba(12, 12, 13, 0.2);
   --grey-90-a30: rgba(12, 12, 13, 0.3);
   --grey-90-a60: rgba(12, 12, 13, 0.6);
   --grey-90-a80: rgba(12, 12, 13, 0.8);
   --white-100: #fff; /* for ui, no special semantic */
 
   /* Typography from Photon */
+  --body-10-font-size: 13px;
+  --body-10-font-weight: 400;
   --title-20-font-size: 17px;
   --title-20-font-weight: 600;
 
   /* Global layout vars */
   --page-width: 664px;
   --base-unit: 4px;
 
   /* Global styles */
   --base-font-style: message-box;
-  --base-font-size: 15px; /* root font of 11px * 1.36em = 15px */
+  --base-font-size: var(--body-10-font-size);
+  --base-font-weight: var(--body-10-font-weight);
   --base-line-height: 1.8;
-  /* --button-font-size should merge with --base-font-size once the base font becomes 13px */
-  --button-font-size: 13px;
+  --button-font-size: var(--base-font-size);
   --micro-font-size: 11px;
 
   --monospace-font-family: monospace;
 
   /*
   * Variables particular to about:debugging
   */
   --alt-heading-icon-size: calc(var(--base-unit) * 6);
@@ -80,16 +82,18 @@ html {
   font: var(--base-font-style);
 }
 
 body {
   margin: 0;
   padding: 0;
   color: var(--text-color);
   font-size: var(--base-font-size);
+  font-weight: var(--base-font-weight);
+  line-height: var(--base-line-height);
   background: var(--bg-color);
 }
 
 dd {
   margin: 0;
   padding: 0;
 }
 
--- a/devtools/client/aboutdebugging-new/src/components/App.css
+++ b/devtools/client/aboutdebugging-new/src/components/App.css
@@ -27,16 +27,17 @@
   height: 100vh;
   overflow: hidden; /* we don't want the sidebar to scroll, only the main content */
 
   display: grid;
   grid-column-gap: 40px;
   grid-template-columns: var(--sidebar-width) auto;
 
   font-size: var(--base-font-size);
+  font-weight: var(--base-font-weight);
   line-height: var(--base-line-height);
 }
 
 .app__sidebar {
   padding-block-start: var(--app-top-padding);
   padding-block-end: var(--app-bottom-padding);
   padding-inline-start: var(--app-left-padding);
 }