fyndiq-styles-medias

fyndiq-styles-medias [] */(https:/*www.npmjs.com/package/fyndiq-styles-medias) */

Media queries helpers for Fyndiq

Installation

The styles can be installed through NPM:

npm i -S fyndiq-styles-medias

Usage

You can import the screen sizes and media queries size helpers in CSS (recommended) or in Javascript

CSS

@import "fyndiq-styles-medias/medias.css";
 
@media (--phone-xs) {
  /* your rules for small phones (<= 320px) */
}
 
@media (--phone) {
  /* your rules for normal phones (<= 425px) */
}
 
@media (--tablet) {
  /* your rules for tablet screens (<= 768px) */
}
 
@media (--desktop) {
  /* your rules for desktop screens (<= 1024px) */
}
 
@media (--desktop-l) {
  /* your rules for large desktop screens (>= 1024px) */
}

You can also import the screen sizes to make advanced media queries. See the source for more info about exported variables.

Javascript

import sizes from 'fyndiq-styles-medias'

See the source for the exported variables.