/** Имя брейкпоинта. Совпадает с ключами `$brkpnts` в assets/scss/mixins/_breakpoints.scss. */
export type CssBreakpointName = 'xs' | 'xm' | 'sm' | 'md' | 'ml' | 'lg' | 'xl';

/**
 * JS-зеркало брейкпоинтов из SCSS.
 *
 * Источник истины — `$brkpnts` в assets/scss/mixins/_breakpoints.scss: по нему работают
 * миксины вёрстки. JS прочитать SCSS не может, поэтому здесь зеркало — оно нужно там, где
 * ширину надо знать в скрипте: `sizes` у картинок, брейкпоинты свайпера, checkDeviceWidth.
 *
 * Значения обязаны совпадать с SCSS — это проверяет `check:breakpoints`. Разойдутся —
 * атрибут `sizes` начнёт врать браузеру про точку переключения раскладки.
 */
export const CSS_BREAKPOINTS: Record<CssBreakpointName, number> = {
  xs: 475,
  xm: 650,
  sm: 960,
  md: 1350,
  ml: 1500,
  lg: 1792,
  xl: 2560,
};