# Breakpoints are used for responsive image configuration within Drupal 8.
# https://www.drupal.org/docs/8/theming-drupal-8/working-with-breakpoints-in-drupal-8
#
# NOTE: While normally used for defining breakpoints for use with the <picture>
# element, it's a better idea to use <img> with srcset and sizes instead.
# - https://css-tricks.com/responsive-images-youre-just-changing-resolutions-use-srcset/
# - https://cloudfour.com/thinks/responsive-images-101-part-5-sizes/

# Below is an example of how to create srcset placeholders in Drupal.
# The sizes attribute still needs to be configured manually within
# `admin/config/media/responsive-image-style`.
# More information: https://chromatichq.com/blog/responsive-images-drupal-8-using-srcset

<%= themeNameMachine %>.srcset.16_9:
  label: '16:9'
  mediaQuery: ''
  weight: 0
  multipliers:
    - 1x
  group: <%= themeName %> Srcset

<%= themeNameMachine %>.srcset.2_1:
  label: '2:1'
  mediaQuery: ''
  weight: 1
  multipliers:
    - 1x
  group: <%= themeName %> Srcset