add favicons

opentech/static_src/src/images/favicons/browserconfig.xml

+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150.png"/>
+            <TileColor>#da532c</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>

opentech/static_src/src/images/favicons/safari-pinned-tab.svg

+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="152.000000pt" height="152.000000pt" viewBox="0 0 152.000000 152.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.11, written by Peter Selinger 2001-2013
+</metadata>
+<g transform="translate(0.000000,152.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M0 760 l0 -760 760 0 760 0 0 760 0 760 -760 0 -760 0 0 -760z m580
+400 l0 -60 -50 0 -50 0 0 -50 0 -50 -60 0 -60 0 0 -235 0 -235 -60 0 -60 0 0
+235 0 235 60 0 60 0 0 60 0 60 50 0 50 0 0 50 0 50 60 0 60 0 0 -60z m480 10
+l0 -50 60 0 60 0 0 -60 0 -60 50 0 50 0 0 -235 0 -235 -60 0 -60 0 0 235 0
+235 -50 0 -50 0 0 50 0 50 -60 0 -60 0 0 60 0 60 60 0 60 0 0 -50z m-580 -700
+l0 -50 50 0 50 0 0 -60 0 -60 -60 0 -60 0 0 50 0 50 -50 0 -50 0 0 60 0 60 60
+0 60 0 0 -50z m700 -10 l0 -60 -60 0 -60 0 0 -50 0 -50 -60 0 -60 0 0 60 0 60
+60 0 60 0 0 50 0 50 60 0 60 0 0 -60z"/>
+</g>
+</svg>

opentech/static_src/src/images/favicons/site.webmanifest

+{
+    "name": "",
+    "short_name": "",
+    "icons": [
+        {
+            "src": "/android-chrome-144x144.png",
+            "sizes": "144x144",
+            "type": "image/png"
+        }
+    ],
+    "theme_color": "#ffffff",
+    "background_color": "#ffffff",
+    "display": "standalone"
+}

opentech/templates/base-apply.html

@@ -23,6 +23,18 @@
             Generate favicons by http://realfavicongenerator.net using the following path: settings.STATIC_URL + img/favicons.
             Then favicon.ico should be copied to a directory called "public" in the application root and puppet does some magic to serve it up at the site root.
         {% endcomment %}
+        <link rel="icon" sizes="144x144" href="{% static 'images/favicons/android-chrome-144.png' %}">
+        <link rel="icon" type="image/png" sizes="16x16" href="{% static 'images/favicons/favicon-16.png' %}">
+        <link rel="icon" type="image/png" sizes="32x32" href="{% static 'images/favicons/favicon-32.png' %}">
+        <link rel="apple-touch-icon" sizes="76x76" href="{% static 'images/favicons/apple-icon-76.png' %}">
+        <link rel="apple-touch-icon" sizes="120x120" href="{% static 'images/favicons/apple-icon-120.png' %}">
+        <link rel="apple-touch-icon" sizes="152x152" href="{% static 'images/favicons/apple-icon-152.png' %}">
+        <link rel="apple-touch-icon" sizes="180x180" href="{% static 'images/favicons/apple-icon-180.png' %}">
+        <link rel="manifest" href="{% static 'images/favicons/manifest.json' %}">
+        <meta name="msapplication-TileColor" content="#da532c">
+        <meta name="msapplication-TileImage" content="{% static 'images/favicons/mstile-150.png' %}">
+        <meta name="theme-color" content="#ffffff">
+        <link rel="mask-icon" href="{% static 'images/favicons/safari-pinned-tab.svg' %}" color="#5bbad5">
 
         {% block extra_css %}{% endblock %}
         <link rel="stylesheet" type="text/css" href="{% static 'css/apply/main.css' %}">

opentech/templates/base.html

@@ -23,6 +23,18 @@
             Generate favicons by http://realfavicongenerator.net using the following path: settings.STATIC_URL + img/favicons.
             Then favicon.ico should be copied to a directory called "public" in the application root and puppet does some magic to serve it up at the site root.
         {% endcomment %}
+        <link rel="icon" sizes="144x144" href="{% static 'images/favicons/android-chrome-144.png' %}">
+        <link rel="icon" type="image/png" sizes="16x16" href="{% static 'images/favicons/favicon-16.png' %}">
+        <link rel="icon" type="image/png" sizes="32x32" href="{% static 'images/favicons/favicon-32.png' %}">
+        <link rel="apple-touch-icon" sizes="76x76" href="{% static 'images/favicons/apple-icon-76.png' %}">
+        <link rel="apple-touch-icon" sizes="120x120" href="{% static 'images/favicons/apple-icon-120.png' %}">
+        <link rel="apple-touch-icon" sizes="152x152" href="{% static 'images/favicons/apple-icon-152.png' %}">
+        <link rel="apple-touch-icon" sizes="180x180" href="{% static 'images/favicons/apple-icon-180.png' %}">
+        <link rel="manifest" href="{% static 'images/favicons/manifest.json' %}">
+        <meta name="msapplication-TileColor" content="#da532c">
+        <meta name="msapplication-TileImage" content="{% static 'images/favicons/mstile-150.png' %}">
+        <meta name="theme-color" content="#ffffff">
+        <link rel="mask-icon" href="{% static 'images/favicons/safari-pinned-tab.svg' %}" color="#5bbad5">
 
         <!-- Twitter summary card - see https://dev.twitter.com/cards/types/summary -->
         <!--  and https://dev.twitter.com/cards/getting-started -->