Breakpoint added to Drupal 8

Breakpoint is introduced in Drupal 8.

The Breakpoints module keeps track of the height, width, and resolution breakpoints where a responsive design needs to change in order to respond to different devices being used to view the site.

Themes and modules can define new breakpoints using the config system
my_theme_or_module/config/install/my_theme_or_module.breakpoints.yml containing the following

mobile: '(min-width: 0px)'
narrow: 'all and (min-width: 560px) and (max-width: 850px)'
wide: 'all and (min-width: 851px)'

This will automatically create 3 new breakpoints when the theme or module is enabled, and it will also create a new breakpoint group containing all defined breakpoints. Keep in mind that the breakpoints are ordered from 'small' to 'big'.

Themes and modules can define extra breakpoint groups by using another config file: my_theme_or_module/config/install/my_theme_or_module.breakpoint_groups.yml
sidebar:
label: Sidebar breakpoints
breakpoints:
- mobile
- wide
maincontent:
label: Main content breakpoints
breakpoints:
- narrow
- wide

In PHP code there're two new entities 'breakpoint' and 'breakpoint_group' that module developers can use to manage breakpoints.

The breakpoint module itself ships with a config file (breakpoint.yml) that defines the multipliers (multipliers: [1x, 1.5x, 2x]), you can use the config system to add new multipliers.

More documentation can be found at http://drupal.org/node/1803874 or on the help page (/admin/help/breakpoint).