feat(template): smarter way to handle favicons

_app/_includes/_amsf.html

@@ -61,9 +61,36 @@
   Favicons
 {% endcomment %}
 {% capture amsf_favicon %}{{ '/favicon.ico' | prepend: site.base }}{% endcapture %}
+{% capture amsf_favicon_png %}{{ '/favicon.png' | prepend: site.base }}{% endcapture %}
 {% capture amsf_favicon_svg %}{{ '/favicon.svg' | prepend: site.base }}{% endcapture %}
+{% capture amsf_mask_icon %}{{ '/mask-icon.svg' | prepend: site.base }}{% endcapture %}
 {% capture amsf_apple_touch_icon %}{{ '/apple-touch-icon.png' | prepend: site.base }}{% endcapture %}
 
+{% capture amsf_favicons %}
+  {% if site.base != "" %}
+    <link rel="icon" href="{{ amsf_favicon }}">
+  {% endif %}
+
+  {% for static_file in site.static_files %}
+    {% if static_file.path == '/favicon.png' %}
+      <link rel="icon" href="{{ amsf_favicon_png }}" sizes="196x196" type="image/png">
+    {% endif %}
+
+    {% if static_file.path == '/favicon.svg' %}
+      <link rel="icon" href="{{ amsf_favicon_svg }}" sizes="any" type="image/svg+xml">
+    {% endif %}
+
+    {% if static_file.path == '/mask-icon.svg' %}
+      <link rel="mask-icon" href="{{ amsf_mask_icon }}" color="{{ site.primary_color }}">
+    {% endif %}
+
+    {% if static_file.path == '/apple-touch-icon.png' %}
+      <link rel="apple-touch-icon" href="{{ amsf_apple_touch_icon }}">
+    {% endif %}
+  {% endfor %}
+{% endcapture %}
+
+
 {% comment %}
   Feed URL
 {% endcomment %}

_app/_includes/themes/curtana/includes/top.html

@@ -15,14 +15,7 @@
 <link rel="alternate" href="{{ amsf_feed_url }}" type="application/atom+xml">
 
 <!-- Site icons -->
-{% if site.base != "" %}
-  <link rel="icon" href="{{ amsf_favicon }}">
-  <link rel="icon" href="{{ amsf_favicon_svg }}" sizes="any" type="image/svg+xml">
-  <link rel="apple-touch-icon" href="{{ amsf_apple_touch_icon }}">
-{% endif %}
-
-<!-- Pinned icon for Safari -->
-<link rel="mask-icon" href="{{ amsf_favicon_svg }}" color="{{ site.primary_color }}">
+{{ amsf_favicons }}
 
 <!-- Main CSS -->
 <link rel="stylesheet" href="{{ '/css/app.css?assets-inline' | prepend: amsf_theme_assets }}">