---
favicon:
  type: 'hash'
apple_touch_sizes:
  type: 'array'
  default:
  - 57
  - 60
  - 72
  - 76
  - 120
  - 144
  - 152
  - 180
chrome_icon_sizes:
  type: 'array'
  default:
  - 36
  - 48
  - 72
  - 96
  - 144
  - 192
  - 256
  - 384
msapplication_sizes:
  type: 'array'
  default:
  - 70
  - 144
  - 150
  - 310
---
{%- for apple_touch_size in apple_touch_sizes -%}
  <link
    rel="apple-touch-icon"
    sizes="{{ apple_touch_size }}x{{ apple_touch_size }}"
    href="{{ favicon.path | thumbnail: apple_touch_size, apple_touch_size | component_escape }}"
  >
{%- endfor -%}

{%- for chrome_icon_size in chrome_icon_sizes -%}
  <link
    rel="icon"
    type="image/{{ favicon.path | extname | remove: '.' }}"
    sizes="{{ chrome_icon_size }}x{{ chrome_icon_size }}"
    href="{{ favicon.path | thumbnail: chrome_icon_size, chrome_icon_size | component_escape }}"
  >
{% endfor %}

{% for msapplication_size in msapplication_sizes %}
  <meta
    name="msapplication-TileImage"
    content="{{ favicon.path | thumbnail: msapplication_size, msapplication_size | component_escape }}"
  >
{% endfor %}