Added cross-platform default fonts

Summary: `system-ui` is provided by modern browsers as [a cross-platform default font](https://caniuse.com/font-family-system-ui). Using this font [was a controversial choice back in 2017](https://infinnie.github.io/blog/2017/systemui.html). because it did not address i18n well and therefore it was removed from Bootstrap [twbs/bootstrap#22377](twbs/bootstrap#22377). However, it was added back in Bootstrap v5 [twbs/bootstrap#30561](twbs/bootstrap#30561) since it got better over time. Fixes T15049. Test Plan: Tested locally for now. Reviewers: O1 Blessed Committers, avivey Reviewed By: O1 Blessed Committers, avivey Subscribers: Matthew, avivey, Cigaryno, 20after4, Ekubischta, speck, tobiaswiese, valerio.bozzolan Maniphest Tasks: T15049 Differential Revision: https://we.phorge.it/D25021
phorgeit · Oct 9, 2022 · f8ffa39 · f8ffa39
1 parent 69b2710
commit f8ffa39
Show file tree

Hide file tree

Showing 6 changed files with 60 additions and 58 deletions.
diff --git a/resources/celerity/map.php b/resources/celerity/map.php
@@ -9,10 +9,10 @@
   'names' => array(
     'conpherence.pkg.css' => '0e3cf785',
     'conpherence.pkg.js' => '020aebcf',
-    'core.pkg.css' => '80481fe6',
-    'core.pkg.js' => 'd2de90d9',
+    'core.pkg.css' => 'd95915b7',
+    'core.pkg.js' => '256dfd7b',
     'dark-console.pkg.js' => '187792c2',
-    'differential.pkg.css' => 'ffb69e3d',
+    'differential.pkg.css' => '609e63d4',
     'differential.pkg.js' => 'c60bec1b',
     'diffusion.pkg.css' => '42c75c37',
     'diffusion.pkg.js' => '78c9885d',
@@ -45,7 +45,7 @@
     'rsrc/css/application/chatlog/chatlog.css' => 'abdc76ee',
     'rsrc/css/application/conduit/conduit-api.css' => 'ce2cfc41',
     'rsrc/css/application/config/config-options.css' => '16c920ae',
-    'rsrc/css/application/config/config-template.css' => '20babf50',
+    'rsrc/css/application/config/config-template.css' => 'e689dbbd',
     'rsrc/css/application/config/setup-issue.css' => '5eed85b2',
     'rsrc/css/application/config/unhandled-exception.css' => '9ecfc00d',
     'rsrc/css/application/conpherence/color.css' => 'b17746b0',
@@ -63,9 +63,9 @@
     'rsrc/css/application/diff/diff-tree-view.css' => 'e2d3e222',
     'rsrc/css/application/diff/inline-comment-summary.css' => '81eb368d',
     'rsrc/css/application/differential/add-comment.css' => '7e5900d9',
-    'rsrc/css/application/differential/changeset-view.css' => '60c3d405',
+    'rsrc/css/application/differential/changeset-view.css' => 'bf159129',
     'rsrc/css/application/differential/core.css' => '7300a73e',
-    'rsrc/css/application/differential/phui-inline-comment.css' => '9863a85e',
+    'rsrc/css/application/differential/phui-inline-comment.css' => 'a864426f',
     'rsrc/css/application/differential/revision-comment.css' => '7dbc8d1d',
     'rsrc/css/application/differential/revision-history.css' => '237a2979',
     'rsrc/css/application/differential/revision-list.css' => '93d2df7d',
@@ -77,7 +77,7 @@
     'rsrc/css/application/feed/feed.css' => 'd8b6e3f8',
     'rsrc/css/application/files/global-drag-and-drop.css' => '1d2713a4',
     'rsrc/css/application/flag/flag.css' => '2b77be8d',
-    'rsrc/css/application/harbormaster/harbormaster.css' => '8dfe16b2',
+    'rsrc/css/application/harbormaster/harbormaster.css' => 'd98decda',
     'rsrc/css/application/herald/herald-test.css' => '7e7bbdae',
     'rsrc/css/application/herald/herald.css' => '648d39e2',
     'rsrc/css/application/maniphest/report.css' => '3d53188b',
@@ -101,15 +101,15 @@
     'rsrc/css/application/policy/policy-transaction-detail.css' => 'c02b8384',
     'rsrc/css/application/policy/policy.css' => 'ceb56a08',
     'rsrc/css/application/ponder/ponder-view.css' => '05a09d0a',
-    'rsrc/css/application/project/project-card-view.css' => 'a9f2c2dd',
+    'rsrc/css/application/project/project-card-view.css' => 'c1200da7',
     'rsrc/css/application/project/project-triggers.css' => 'cd9c8bb9',
-    'rsrc/css/application/project/project-view.css' => '567858b3',
+    'rsrc/css/application/project/project-view.css' => '2f7caa20',
     'rsrc/css/application/search/application-search-view.css' => '0f7c06d8',
     'rsrc/css/application/search/search-results.css' => '9ea70ace',
     'rsrc/css/application/slowvote/slowvote.css' => '1694baed',
     'rsrc/css/application/tokens/tokens.css' => 'ce5a50bd',
     'rsrc/css/application/uiexample/example.css' => 'b4795059',
-    'rsrc/css/core/core.css' => 'b3ebd90d',
+    'rsrc/css/core/core.css' => 'a708bd25',
     'rsrc/css/core/remarkup.css' => '5baa3bd9',
     'rsrc/css/core/syntax.css' => '548567f6',
     'rsrc/css/core/z-index.css' => 'ac3bfcd4',
@@ -124,7 +124,7 @@
     'rsrc/css/layout/phabricator-source-code-view.css' => '6b31244f',
     'rsrc/css/phui/button/phui-button-bar.css' => 'a4aa75c4',
     'rsrc/css/phui/button/phui-button-simple.css' => '1ff278aa',
-    'rsrc/css/phui/button/phui-button.css' => 'ea704902',
+    'rsrc/css/phui/button/phui-button.css' => 'e434f171',
     'rsrc/css/phui/calendar/phui-calendar-day.css' => '9597d706',
     'rsrc/css/phui/calendar/phui-calendar-list.css' => 'ccd7e4e2',
     'rsrc/css/phui/calendar/phui-calendar-month.css' => 'cb758c42',
@@ -142,7 +142,7 @@
     'rsrc/css/phui/phui-big-info-view.css' => '362ad37b',
     'rsrc/css/phui/phui-box.css' => '5ed3b8cb',
     'rsrc/css/phui/phui-bulk-editor.css' => '374d5e30',
-    'rsrc/css/phui/phui-chart.css' => '14df9ae3',
+    'rsrc/css/phui/phui-chart.css' => 'fe8f87a7',
     'rsrc/css/phui/phui-cms.css' => '8c05c41e',
     'rsrc/css/phui/phui-comment-form.css' => '68a2d99a',
     'rsrc/css/phui/phui-comment-panel.css' => 'ec4e31c0',
@@ -155,7 +155,7 @@
     'rsrc/css/phui/phui-feed-story.css' => 'a0c05029',
     'rsrc/css/phui/phui-fontkit.css' => '1ec937e5',
     'rsrc/css/phui/phui-form-view.css' => '01b796c0',
-    'rsrc/css/phui/phui-form.css' => '1f177cb7',
+    'rsrc/css/phui/phui-form.css' => 'd1adb52c',
     'rsrc/css/phui/phui-formation-view.css' => 'd2dec8ed',
     'rsrc/css/phui/phui-head-thing.css' => 'd7f293df',
     'rsrc/css/phui/phui-header-view.css' => '36c86a58',
@@ -168,7 +168,7 @@
     'rsrc/css/phui/phui-left-right.css' => '68513c34',
     'rsrc/css/phui/phui-lightbox.css' => '4ebf22da',
     'rsrc/css/phui/phui-list.css' => '0c04affd',
-    'rsrc/css/phui/phui-object-box.css' => 'b8d7eea0',
+    'rsrc/css/phui/phui-object-box.css' => 'fdffed5c',
     'rsrc/css/phui/phui-pager.css' => 'd022c7ad',
     'rsrc/css/phui/phui-pinboard-view.css' => '1f08f5d8',
     'rsrc/css/phui/phui-policy-section-view.css' => '139fdc64',
@@ -257,7 +257,7 @@
     'rsrc/externals/javelin/lib/URI.js' => '2e255291',
     'rsrc/externals/javelin/lib/Vector.js' => 'e9c80beb',
     'rsrc/externals/javelin/lib/WebSocket.js' => 'fdc13e4e',
-    'rsrc/externals/javelin/lib/Workflow.js' => '945ff654',
+    'rsrc/externals/javelin/lib/Workflow.js' => 'd7ba6915',
     'rsrc/externals/javelin/lib/__tests__/Cookie.js' => 'ca686f71',
     'rsrc/externals/javelin/lib/__tests__/DOM.js' => '4566e249',
     'rsrc/externals/javelin/lib/__tests__/JSON.js' => '710377ae',
@@ -559,7 +559,7 @@
     'conpherence-transaction-css' => '3a3f5e7e',
     'd3' => '9d068042',
     'diff-tree-view-css' => 'e2d3e222',
-    'differential-changeset-view-css' => '60c3d405',
+    'differential-changeset-view-css' => 'bf159129',
     'differential-core-view-css' => '7300a73e',
     'differential-revision-add-comment-css' => '7e5900d9',
     'differential-revision-comment-css' => '7dbc8d1d',
@@ -578,7 +578,7 @@
     'fuel-map-css' => 'd6e31510',
     'fuel-menu-css' => '21f5d199',
     'global-drag-and-drop-css' => '1d2713a4',
-    'harbormaster-css' => '8dfe16b2',
+    'harbormaster-css' => 'd98decda',
     'herald-css' => '648d39e2',
     'herald-rule-editor' => '2633bef7',
     'herald-test-css' => '7e7bbdae',
@@ -756,7 +756,7 @@
     'javelin-workboard-header' => '111bfd2d',
     'javelin-workboard-header-template' => 'ebe83a6b',
     'javelin-workboard-order-template' => '03e8891f',
-    'javelin-workflow' => '945ff654',
+    'javelin-workflow' => 'd7ba6915',
     'maniphest-report-css' => '3d53188b',
     'maniphest-task-edit-css' => '272daa84',
     'maniphest-task-summary-css' => '61d1667e',
@@ -771,7 +771,7 @@
     'phabricator-busy' => '5202e831',
     'phabricator-chatlog-css' => 'abdc76ee',
     'phabricator-content-source-view-css' => 'cdf0d579',
-    'phabricator-core-css' => 'b3ebd90d',
+    'phabricator-core-css' => 'a708bd25',
     'phabricator-countdown-css' => 'bff8012f',
     'phabricator-darklog' => '3b869402',
     'phabricator-darkmessage' => '26cd4b73',
@@ -784,7 +784,7 @@
     'phabricator-diff-tree-view' => '5d83623b',
     'phabricator-drag-and-drop-file-upload' => '4370900d',
     'phabricator-draggable-list' => '0169e425',
-    'phabricator-fatal-config-template-css' => '20babf50',
+    'phabricator-fatal-config-template-css' => 'e689dbbd',
     'phabricator-favicon' => '7930776a',
     'phabricator-feed-css' => 'd8b6e3f8',
     'phabricator-file-upload' => 'ab85e184',
@@ -827,13 +827,13 @@
     'phui-box-css' => '5ed3b8cb',
     'phui-bulk-editor-css' => '374d5e30',
     'phui-button-bar-css' => 'a4aa75c4',
-    'phui-button-css' => 'ea704902',
+    'phui-button-css' => 'e434f171',
     'phui-button-simple-css' => '1ff278aa',
     'phui-calendar-css' => 'f11073aa',
     'phui-calendar-day-css' => '9597d706',
     'phui-calendar-list-css' => 'ccd7e4e2',
     'phui-calendar-month-css' => 'cb758c42',
-    'phui-chart-css' => '14df9ae3',
+    'phui-chart-css' => 'fe8f87a7',
     'phui-cms-css' => '8c05c41e',
     'phui-comment-form-css' => '68a2d99a',
     'phui-comment-panel-css' => 'ec4e31c0',
@@ -846,7 +846,7 @@
     'phui-feed-story-css' => 'a0c05029',
     'phui-font-icon-base-css' => '303c9b87',
     'phui-fontkit-css' => '1ec937e5',
-    'phui-form-css' => '1f177cb7',
+    'phui-form-css' => 'd1adb52c',
     'phui-form-view-css' => '01b796c0',
     'phui-formation-view-css' => 'd2dec8ed',
     'phui-head-thing-view-css' => 'd7f293df',
@@ -858,12 +858,12 @@
     'phui-icon-view-css' => '4cbc684a',
     'phui-image-mask-css' => '62c7f4d2',
     'phui-info-view-css' => 'a10a909b',
-    'phui-inline-comment-view-css' => '9863a85e',
+    'phui-inline-comment-view-css' => 'a864426f',
     'phui-invisible-character-view-css' => 'c694c4a4',
     'phui-left-right-css' => '68513c34',
     'phui-lightbox-css' => '4ebf22da',
     'phui-list-view-css' => '0c04affd',
-    'phui-object-box-css' => 'b8d7eea0',
+    'phui-object-box-css' => 'fdffed5c',
     'phui-oi-big-ui-css' => 'fa74cc35',
     'phui-oi-color-css' => 'b517bfa0',
     'phui-oi-drag-ui-css' => 'da15d3dc',
@@ -900,9 +900,9 @@
     'policy-edit-css' => '8794e2ed',
     'policy-transaction-detail-css' => 'c02b8384',
     'ponder-view-css' => '05a09d0a',
-    'project-card-view-css' => 'a9f2c2dd',
+    'project-card-view-css' => 'c1200da7',
     'project-triggers-css' => 'cd9c8bb9',
-    'project-view-css' => '567858b3',
+    'project-view-css' => '2f7caa20',
     'setup-issue-css' => '5eed85b2',
     'sprite-login-css' => '18b368a6',
     'sprite-tokens-css' => 'f1896dc5',
@@ -1512,9 +1512,6 @@
     '5faf27b9' => array(
       'phuix-form-control-view',
     ),
-    '60c3d405' => array(
-      'phui-inline-comment-view-css',
-    ),
     '60cd9241' => array(
       'javelin-behavior',
     ),
@@ -1747,17 +1744,6 @@
       'javelin-typeahead-preloaded-source',
       'javelin-util',
     ),
-    '945ff654' => array(
-      'javelin-stratcom',
-      'javelin-request',
-      'javelin-dom',
-      'javelin-vector',
-      'javelin-install',
-      'javelin-util',
-      'javelin-mask',
-      'javelin-uri',
-      'javelin-routable',
-    ),
     '9623adc1' => array(
       'javelin-behavior',
       'javelin-stratcom',
@@ -2013,6 +1999,9 @@
       'phabricator-drag-and-drop-file-upload',
       'javelin-workboard-board',
     ),
+    'bf159129' => array(
+      'phui-inline-comment-view-css',
+    ),
     'c03f2fb4' => array(
       'javelin-install',
     ),
@@ -2080,6 +2069,17 @@
     'd4cc2d2a' => array(
       'javelin-install',
     ),
+    'd7ba6915' => array(
+      'javelin-stratcom',
+      'javelin-request',
+      'javelin-dom',
+      'javelin-vector',
+      'javelin-install',
+      'javelin-util',
+      'javelin-mask',
+      'javelin-uri',
+      'javelin-routable',
+    ),
     'd7d3ba75' => array(
       'javelin-dom',
       'javelin-util',

diff --git a/src/applications/celerity/postprocessor/CelerityDarkModePostprocessor.php b/src/applications/celerity/postprocessor/CelerityDarkModePostprocessor.php
@@ -15,13 +15,13 @@ public function buildVariables() {
     return array(
 
       // Fonts
-      'basefont' => "13px 'Segoe UI', 'Segoe UI Emoji', ".
-        "'Segoe UI Symbol', 'Lato', 'Helvetica Neue', ".
-        "Helvetica, Arial, sans-serif",
+      'basefont' => "13px -apple-system, system-ui, BlinkMacSystemFont, ".
+        "'Segoe UI', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Lato', ".
+        "'Helvetica Neue', Helvetica, Arial, sans-serif",
 
-      'fontfamily' => "'Segoe UI', 'Segoe UI Emoji', ".
-        "'Segoe UI Symbol', 'Lato', 'Helvetica Neue', ".
-        "Helvetica, Arial, sans-serif",
+      'fontfamily' => "-apple-system, system-ui, BlinkMacSystemFont, ".
+        "'Segoe UI', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Lato', ".
+        "'Helvetica Neue', Helvetica, Arial, sans-serif",
 
       // Drop Shadow
       'dropshadow' => '0 2px 12px rgba(0, 0, 0, .20)',

diff --git a/src/applications/celerity/postprocessor/CelerityDefaultPostprocessor.php b/src/applications/celerity/postprocessor/CelerityDefaultPostprocessor.php
@@ -20,13 +20,13 @@ public function buildDefaultPostprocessor() {
   public function buildVariables() {
     return array(
       // Fonts
-      'basefont' => "13px 'Segoe UI', 'Segoe UI Emoji', ".
-        "'Segoe UI Symbol', 'Lato', 'Helvetica Neue', ".
-        "Helvetica, Arial, sans-serif",
+      'basefont' => "13px -apple-system, system-ui, BlinkMacSystemFont, ".
+        "'Segoe UI', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Lato', ".
+        "'Helvetica Neue', Helvetica, Arial, sans-serif",
 
-      'fontfamily' => "'Segoe UI', 'Segoe UI Emoji', ".
-        "'Segoe UI Symbol', 'Lato', 'Helvetica Neue', ".
-        "Helvetica, Arial, sans-serif",
+      'fontfamily' => "-apple-system, system-ui, BlinkMacSystemFont, ".
+        "'Segoe UI', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Lato', ".
+        "'Helvetica Neue', Helvetica, Arial, sans-serif",
 
       // Drop Shadow
       'dropshadow' => '0 2px 12px rgba(0, 0, 0, .20)',

diff --git a/src/applications/celerity/postprocessor/CelerityLargeFontPostprocessor.php b/src/applications/celerity/postprocessor/CelerityLargeFontPostprocessor.php
@@ -14,9 +14,9 @@ public function getPostprocessorName() {
   public function buildVariables() {
     return array(
 
-      'basefont' => "14px 'Segoe UI', 'Segoe UI Web Regular', ".
-        "'Segoe UI Symbol', 'Lato', 'Helvetica Neue', Helvetica, ".
-        "Arial, sans-serif",
+      'basefont' => "14px -apple-system, system-ui, BlinkMacSystemFont, ".
+        "'Segoe UI', 'Segoe UI Web Regular', 'Segoe UI Symbol', 'Lato', ".
+        "'Helvetica Neue', Helvetica, Arial, sans-serif",
 
       // Font Sizes
       'biggestfontsize' => '16px',

diff --git a/webroot/rsrc/css/application/config/config-template.css b/webroot/rsrc/css/application/config/config-template.css
@@ -6,7 +6,8 @@ body {
   background: #f9f9f9;
   margin: 0;
   padding: 0;
-  font: 13px/1.231 'Segoe UI', 'Segoe UI Web Regular', 'Segoe UI Symbol',
+  font: 13px/1.231 -apple-system, system-ui, BlinkMacSystemFont,
+    'Segoe UI', 'Segoe UI Web Regular', 'Segoe UI Symbol',
     'Helvetica Neue', Helvetica, Arial, sans-serif;
   text-align: left;
   -webkit-text-size-adjust: none;

diff --git a/webroot/rsrc/css/application/harbormaster/harbormaster.css b/webroot/rsrc/css/application/harbormaster/harbormaster.css
@@ -106,7 +106,8 @@
 
 .harbormaster-log-expand-table td {
   vertical-align: middle;
-  font: 13px 'Segoe UI', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Lato',
+  font: 13px -apple-system, system-ui, BlinkMacSystemFont,
+    'Segoe UI', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Lato',
     'Helvetica Neue', Helvetica, Arial, sans-serif;
 }