Change Favicon in to look better in a variety of cases

This commit is contained in:
Erica Wright 2017-10-06 11:24:17 -04:00
parent ff9a0979f6
commit 6de91b5872
No known key found for this signature in database
GPG Key ID: D9F2AF9D67D0AAB7
14 changed files with 43 additions and 3 deletions

BIN
assets/favicon-120.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

BIN
assets/favicon-128.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB

BIN
assets/favicon-144.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.3 KiB

BIN
assets/favicon-152.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.8 KiB

BIN
assets/favicon-167.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.6 KiB

BIN
assets/favicon-180.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.4 KiB

BIN
assets/favicon-195.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.6 KiB

BIN
assets/favicon-196.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.7 KiB

BIN
assets/favicon-228.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.0 KiB

BIN
assets/favicon-32.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.8 KiB

BIN
assets/favicon-96.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.8 KiB

10
browserconfig.xml Normal file
View File

@ -0,0 +1,10 @@
<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
<msapplication>
<tile>
<square70x70logo src=“favicon-76.png”/>
<square150x150logo src="favicon-228.png"/>
<TileColor>#0297F8</TileColor>
</tile>
</msapplication>
</browserconfig>

View File

@ -31,9 +31,39 @@ module.exports = function(state, body = '') {
<title>${state.title}</title> <title>${state.title}</title>
<link rel="stylesheet" type="text/css" href="${assets.get('main.css')}" /> <link rel="stylesheet" type="text/css" href="${assets.get('main.css')}" />
<link rel="icon" type="image/png" href="${assets.get(
'favicon-32x32.png' <!-- generic favicons -->
)}" sizes="32x32" /> <link rel="icon" href="${assets.get('favicon-32.png')}" sizes="32x32">
<link rel="icon" href="${assets.get('favicon-96.png')}" sizes="96x96">
<link rel="icon" href="${assets.get('favicon-128.png')}" sizes="128x128">
<link rel="icon" href="${assets.get('favicon-228.png')}" sizes="228x228">
<!-- Android -->
<link rel="shortcut icon" href="${assets.get(
'favicon-196.png'
)}" sizes="196x196">
<!-- iOS -->
<link rel="apple-touch-icon" href="${assets.get(
'favicon-120.png'
)}" sizes="120x120">
<link rel="apple-touch-icon" href="${assets.get(
'favicon-152.png'
)}" sizes="152x152">
<link rel="apple-touch-icon" href="${assets.get(
'favicon-180.png'
)}" sizes="180x180">
<!-- Windows 8 IE 10-->
<meta name="msapplication-TileColor" content="#FFFFFF">
<meta name="msapplication-TileImage" content="${assets.get(
'favicon-144.png'
)}">
<! Windows 8.1 + IE11 and above >
<meta name="msapplication-config" content="/browserconfig.xml"/>
${firaTag} ${firaTag}
<script defer src="/jsconfig.js"></script> <script defer src="/jsconfig.js"></script>
<script defer src="${assets.get('runtime.js')}"></script> <script defer src="${assets.get('runtime.js')}"></script>