Updated with better font-weight testing and Outlook issue demonstration

hteumeuleu · Jun 23, 2022 · e90ea2b · e90ea2b
1 parent 984ad95
commit e90ea2b
Show file tree

Hide file tree

Showing 2 changed files with 70 additions and 25 deletions.
diff --git a/_features/css-font-weight.md b/_features/css-font-weight.md
@@ -3,35 +3,38 @@ title: "font-weight"
 description: ""
 category: css
 keywords: font,weight
-last_test_date: "2021-01-31"
+last_test_date: "2022-06-23"
 test_url: "/tests/css-font-weight.html"
-test_results_url: "https://testi.at/proj/5QnIVlijE5FP53uPe4Ty0F8P"
+test_results_url: "https://app.emailonacid.com/app/acidtest/n4Dj7AQAtcFsJEgkLoSucoofVEvWrmqTqsO5pev2ew8XN/list"
 stats: {
   apple-mail: {
     macos: {
       "11": "y",
       "12": "y",
-      "13": "y"
+      "13": "y",
+	  "14": "y",
+	  "15": "y"
     },
     ios: {
       "11": "y",
       "12": "y",
       "13": "y",
-      "14": "y"
+      "14": "y",
+	  "15": "y"
     }
   },
   gmail: {
     desktop-webmail: {
-      "2021-01": "y"
+      "2022-06": "y"
     },
     ios: {
-      "2021-01": "y"
+      "2022-06": "y"
     },
     android: {
-      "2021-01": "y"
+      "2022-06": "y"
     },
     mobile-webmail: {
-      "2021-01": "y"
+      "2022-06": "y"
     }
   },
   orange: {
@@ -48,14 +51,14 @@ stats: {
   },
   outlook: {
     windows: {
-      "2007": "a #1",
-      "2010": "a #1",
-      "2013": "a #1",
-      "2016": "a #1",
-      "2019": "a #1"
+      "2007": "a #2",
+      "2010": "a #2",
+      "2013": "a #2",
+      "2016": "a #2",
+      "2019": "a #2"
     },
     windows-mail: {
-      "2021-01": "a #1"
+      "2021-01": "a #2"
     },
     macos: {
       "2021-01": "y"
@@ -83,7 +86,7 @@ stats: {
   },
   aol: {
     desktop-webmail: {
-      "2021-01": "a #1"
+      "2022-06": "a #1"
     },
     ios: {
       "2021-01": "a #1"
@@ -131,7 +134,7 @@ stats: {
   },
   mail-ru: {
     desktop-webmail: {
-      "2021-01":"y"
+      "2022-06":"y"
     }
   },
   fastmail: {
@@ -146,7 +149,8 @@ stats: {
   }
 }
 notes_by_num: {
-  "1": "Partial support. `<number>` values are not supported as per CSS Fonts Level 4 where any `<number>` value between 1 and 1000 (inclusive) is a valid value. Only the following numeric values are supported: 100, 200, 300, 400, 500, 600, 700, 800, and 900."
+  "1": "Partial support. `<number>` values are not supported as per CSS Fonts Level 4 where any `<number>` value between 1 and 1000 (inclusive) is a valid value. Only the following numeric values are supported: 100, 200, 300, 400, 500, 600, 700, 800, and 900.",
+  "2": "Partial support. `<number>` values between 0 and 599 are set as normal font weight. `<number>` values between 600 and 1000 are set as bold font weight."
 }
 links: {
   "Can I use: CSS property: font-weight":"https://caniuse.com/mdn-css_properties_font-weight",

diff --git a/tests/css-font-weight.html b/tests/css-font-weight.html
@@ -4,14 +4,55 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>font-weight</title>
-</head>
+  <!--Specific font stack used for maximum cross-client demonstration ability.-->
+   <style>
+  h1 {font-family: Segoe UI, Helvetica Neue, Roboto, Ubuntu, sans-serif;}
+   </style>
+  </head> 
 <body>
-  <p style="font-weight:400;">font-weight:400</p>
-  <p style="font-weight:700;">font-weight:700</p>
+<h1 style="padding-top: 25px; padding-bottom:25px; border-bottom: 3px solid">
+   Fonts by weight keywords:
+  </h1>
+  <h1 style="font-weight:normal">
+    Font Weight Normal
+  </h1>
+  <h1 style="font-weight:bold">
+    Font Weight Bold
+  </h1>
+  <h1 style="font-weight:bold">
+    Font Weight <span style="font-weight:lighter">Lighter</span>
+  </h1>
+    <h1 style="font-weight:normal">
+    Font Weight <span style="font-weight:bolder">Bolder</span>
+  </h1>
+<h1 style="padding-top: 50px;padding-bottom:25px; border-bottom: 3px solid"> Fonts by weight number:</h1>
 
-  <p style="font-weight:normal;">font-weight:normal <span style="font-weight:bolder;">font-weight:bolder</span></p>
-  <p style="font-weight:bold;">font-weight:bold <span style="font-weight:lighter;">font-weight:lighter</span></p>
-
-  <p style="font-weight:888;">font-weight:888</p>
-</body>
+<h1 style="font-weight:100">
+  Font Weight 100
+</h1>
+<h1 style="font-weight:200">
+  Font Weight 200
+</h1>
+<h1 class="segoe" style="font-weight:300">
+  Font Weight 300
+</h1>
+<h1 class="segoe" style="font-weight:400">
+  Font Weight 400
+</h1>
+<h1 class="segoe" style="font-weight:500">
+  Font Weight 500
+</h1>
+<h1 class="segoe" style="font-weight:600">
+  Font Weight 600
+</h1>
+<h1 class="segoe" style="font-weight:700">
+  Font Weight 700
+</h1>
+<h1 class="segoe" style="font-weight:800">
+  Font Weight 800
+</h1>
+<h1 class="segoe" style="font-weight:900">
+  Font Weight 900
+</h1>
+  </body>
 </html>