Add mask-icon for Safari pinned tab

Summary:
Addresses T9814. Adds SVG files to Celerity maps. Adds a mask-icon.svg file that
I made by pulling the existing favicon into Illustrator and running trace on it.

This hardcodes the header color from the default theme, and doesn't pay attention
to customizations of the header.

Test Plan: I pinned the tab in Safari.

Reviewers: epriestley, #blessed_reviewers, chad

Reviewed By: #blessed_reviewers, chad

Subscribers: chad, Korvin

Maniphest Tasks: T9814

Differential Revision: https://secure.phabricator.com/D14527

resources/celerity/map.php

@@ -108,9 +108,9 @@ return array(
     'rsrc/css/core/syntax.css' => '9fd11da8',
     'rsrc/css/core/z-index.css' => '57ddcaa2',
     'rsrc/css/diviner/diviner-shared.css' => 'aa3656aa',
-    'rsrc/css/font/font-aleo.css' => 'b61d3062',
+    'rsrc/css/font/font-aleo.css' => '8bdb2835',
     'rsrc/css/font/font-awesome.css' => 'd2fc4e8d',
-    'rsrc/css/font/font-lato.css' => '5ab1a46a',
+    'rsrc/css/font/font-lato.css' => 'c7ccd872',
     'rsrc/css/font/phui-font-icon-base.css' => 'ecbbb4c2',
     'rsrc/css/layout/phabricator-filetree-view.css' => 'fccf9f82',
     'rsrc/css/layout/phabricator-hovercard-view.css' => '1239cd52',
@@ -158,10 +158,12 @@ return array(
     'rsrc/css/sprite-projects.css' => 'e5ad842a',
     'rsrc/css/sprite-tokens.css' => '4f399012',
     'rsrc/externals/font/aleo/aleo-bold.eot' => 'd3d3bed7',
+    'rsrc/externals/font/aleo/aleo-bold.svg' => '45899c8e',
     'rsrc/externals/font/aleo/aleo-bold.ttf' => '4b08bef0',
     'rsrc/externals/font/aleo/aleo-bold.woff' => '93b513a1',
     'rsrc/externals/font/aleo/aleo-bold.woff2' => '75fbf322',
     'rsrc/externals/font/aleo/aleo-regular.eot' => 'a4e29e2f',
+    'rsrc/externals/font/aleo/aleo-regular.svg' => '42a86f7a',
     'rsrc/externals/font/aleo/aleo-regular.ttf' => '751e7479',
     'rsrc/externals/font/aleo/aleo-regular.woff' => 'c3744be9',
     'rsrc/externals/font/aleo/aleo-regular.woff2' => '851aa0ee',
@@ -170,18 +172,22 @@ return array(
     'rsrc/externals/font/fontawesome/fontawesome-webfont.woff' => '427fe363',
     'rsrc/externals/font/fontawesome/fontawesome-webfont.woff2' => 'a9897054',
     'rsrc/externals/font/lato/lato-bold.eot' => '99fbcf8c',
+    'rsrc/externals/font/lato/lato-bold.svg' => '2aa83045',
     'rsrc/externals/font/lato/lato-bold.ttf' => '0a7141f7',
     'rsrc/externals/font/lato/lato-bold.woff' => 'f5db2061',
     'rsrc/externals/font/lato/lato-bold.woff2' => '37a94ecd',
     'rsrc/externals/font/lato/lato-bolditalic.eot' => 'b93389d0',
+    'rsrc/externals/font/lato/lato-bolditalic.svg' => '5442e1ef',
     'rsrc/externals/font/lato/lato-bolditalic.ttf' => 'dad31252',
     'rsrc/externals/font/lato/lato-bolditalic.woff' => 'e53bcf47',
     'rsrc/externals/font/lato/lato-bolditalic.woff2' => 'd035007f',
     'rsrc/externals/font/lato/lato-italic.eot' => '6a903f5d',
+    'rsrc/externals/font/lato/lato-italic.svg' => '0dc7cf2f',
     'rsrc/externals/font/lato/lato-italic.ttf' => '629f64f0',
     'rsrc/externals/font/lato/lato-italic.woff' => '678dc4bb',
     'rsrc/externals/font/lato/lato-italic.woff2' => '7c8dd650',
     'rsrc/externals/font/lato/lato-regular.eot' => '848dfb1e',
+    'rsrc/externals/font/lato/lato-regular.svg' => 'cbd5fd6b',
     'rsrc/externals/font/lato/lato-regular.ttf' => 'e270165b',
     'rsrc/externals/font/lato/lato-regular.woff' => '13d39fe2',
     'rsrc/externals/font/lato/lato-regular.woff2' => '57a9f742',
@@ -255,6 +261,7 @@ return array(
     'rsrc/favicons/favicon-16x16.png' => 'ee2523ac',
     'rsrc/favicons/favicon-32x32.png' => 'b6a8150e',
     'rsrc/favicons/favicon-96x96.png' => '8f7ea177',
+    'rsrc/favicons/mask-icon.svg' => '0460cb1f',
     'rsrc/image/BFCFDA.png' => 'd5ec91f4',
     'rsrc/image/actions/edit.png' => '2fc41442',
     'rsrc/image/avatar.png' => '3eb28cd9',
@@ -529,9 +536,9 @@ return array(
     'diffusion-readme-css' => '2106ea08',
     'diffusion-source-css' => '075ba788',
     'diviner-shared-css' => 'aa3656aa',
-    'font-aleo' => 'b61d3062',
+    'font-aleo' => '8bdb2835',
     'font-fontawesome' => 'd2fc4e8d',
-    'font-lato' => '5ab1a46a',
+    'font-lato' => 'c7ccd872',
     'global-drag-and-drop-css' => '697324ad',
     'harbormaster-css' => 'b0758ca5',
     'herald-css' => '826075fa',
@@ -1206,9 +1213,6 @@ return array(
       'javelin-vector',
       'javelin-dom',
     ),
-    '5ab1a46a' => array(
-      'phui-fontkit-css',
-    ),
     '5b2e3e2b' => array(
       'javelin-stratcom',
       'javelin-request',
@@ -1506,6 +1510,9 @@ return array(
       'javelin-request',
       'javelin-typeahead-source',
     ),
+    '8bdb2835' => array(
+      'phui-fontkit-css',
+    ),
     '8ce821c5' => array(
       'phabricator-notification',
       'javelin-stratcom',
@@ -1717,9 +1724,6 @@ return array(
       'javelin-dom',
       'javelin-util',
     ),
-    'b61d3062' => array(
-      'phui-fontkit-css',
-    ),
     'b6993408' => array(
       'javelin-behavior',
       'javelin-stratcom',
@@ -1775,6 +1779,9 @@ return array(
       'phabricator-keyboard-shortcut',
       'conpherence-thread-manager',
     ),
+    'c7ccd872' => array(
+      'phui-fontkit-css',
+    ),
     'c8e57404' => array(
       'javelin-behavior',
       'javelin-dom',

src/applications/celerity/controller/CelerityResourceController.php

@@ -125,6 +125,7 @@ abstract class CelerityResourceController extends PhabricatorController {
       'css' => 'text/css; charset=utf-8',
       'js'  => 'text/javascript; charset=utf-8',
       'png' => 'image/png',
+      'svg' => 'image/svg+xml',
       'gif' => 'image/gif',
       'jpg' => 'image/jpeg',
       'swf' => 'application/x-shockwave-flash',

src/applications/celerity/resources/CelerityResourcesOnDisk.php

@@ -33,6 +33,7 @@ abstract class CelerityResourcesOnDisk extends CelerityPhysicalResources {
       'jpg',
       'gif',
       'swf',
+      'svg',
       'woff',
       'woff2',
       'ttf',

src/view/page/PhabricatorBarePageView.php

@@ -75,6 +75,16 @@ class PhabricatorBarePageView extends AphrontPageView {
                        'maximum-scale=1',
         ));
     }
+
+    $mask_icon = phutil_tag(
+      'link',
+      array(
+        'rel' => 'mask-icon',
+        'color' => '#3D4B67',
+        'href' => celerity_get_resource_uri(
+          '/rsrc/favicons/mask-icon.svg'),
+      ));
+
     $icon_tag_76 = phutil_tag(
       'link',
       array(
@@ -130,8 +140,9 @@ class PhabricatorBarePageView extends AphrontPageView {
 
     $developer = PhabricatorEnv::getEnvConfig('phabricator.developer-mode');
     return hsprintf(
-      '%s%s%s%s%s%s%s%s',
+      '%s%s%s%s%s%s%s%s%s',
       $viewport_tag,
+      $mask_icon,
       $icon_tag_76,
       $icon_tag_120,
       $icon_tag_152,

webroot/rsrc/favicons/mask-icon.svg

@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+  viewBox="0 0 152 152" style="enable-background:new 0 0 152 152;"
+  xml:space="preserve">
+<g>
+  <path d="M152,152c-50.7,0-101.3,0-152,0C0,101.3,0,50.7,0,0c50.7,0,101.3,0,152,
+    0C152,50.7,152,101.3,152,152z M36.3,109.2
+    c3,5.7,5.8,11.3,9,17.5c7.1-3,13.7-5.8,20.6-8.7c-2.2-6.8-4.1-12.8-6-18.7c4.3
+    -2.8,8.1-5.4,12.1-8c5,4.3,9.7,8.3,14.1,12.1
+    c5.7-5.6,10.8-10.6,16.1-15.8C98,82.6,94,77.8,90,73.2c3-4.4,5.6-8.2,8.2-11.9
+    c6.3,2,12.1,3.8,18.6,5.9c2.9-7,5.7-13.6,8.5-20.6
+    c-6.3-3.3-11.8-6.2-17.4-9.1c1-5,1.9-9.5,2.9-14.1c6.6-0.6,12.8-1.2,19.2-1.8
+    c0-4.4,0-8.1,0-12c-17.5,0-34.7,0-51.9,0
+    C77.5,43.6,52.7,77.3,9.6,79.4c0,17.2,0,34.4,0,52.3c3.8-0.2,7.2-0.4,10.9-0.6
+    c0.6-6.6,1.2-12.8,1.7-19.2
+    C27.1,111,31.6,110.1,36.3,109.2z M9.6,50.6c20.4,3.3,44.3-21.2,40.2-41c-13.3,
+    0-26.6,0-40.2,0C9.6,23.6,9.6,37.1,9.6,50.6z"/>
+</g>
+</svg>