ergonomic-breakpoint

1.1.1 • Public • Published

ergonomic-breakpoint

NPM version Downloads

Ergonomic CSS media queries. Uses CSS custom media queries.

lwb-ergonomic viewports

Installation

$ npm install ergonomic-breakpoint

Usage

With cssnext or sheetify installed:

@media (--wrist) {
  /* styles for wrist viewport */
}
 
@media (--lap) and (--desk) {
  /* styles for lap and desk viewports */
}
 
@media (--not-wrist) and (--not-palm) {
  /* styles for lap and larger viewports */
}

API

@media (--wrist)

Wrist viewport. <320px.

@media (--palm)

Palm viewport. >=320px && <800px.

@media (--lap)

Lap viewport. >=800px && <1920px.

@media (--desk)

Desk viewport. >=1920px && <2560px.

@media (--wall)

Wall viewport. >=2560px.

@media (--not-wrist)

Wrist viewport. >=320px.

@media (--not-palm)

Palm viewport. <320px && >=800px.

@media (--not-lap)

Lap viewport. <800px && >=1920px.

@media (--not-desk)

Desk viewport. <1920px && >=2560px.

@media (--not-wall)

Wall viewport. <2560px.

See Also

License

MIT

Package Sidebar

Install

npm i ergonomic-breakpoint

Weekly Downloads

0

Version

1.1.1

License

MIT

Last publish

Collaborators

  • yoshuawuyts