@avalanche/setting-breakpoints

Breakpoint sizes

4.0.0-alpha.5
latest
Source
npm

Version published: 7 years ago

Maintainers: 2

Created: 8 years ago

Source

@avalanche/setting-breakpoints

Breakpoint sizes.

[Documentation](https://avalanche.oberlehner.net/documentation/#setting: breakpoints)

Install

npm install @avalanche/setting-breakpoints --save-dev

Basic usage

// Import the main file.
@import 'node_modules/@avalanche/setting-breakpoints/scss/index.scss';

// Import just the settings file.
@import 'node_modules/@avalanche/setting-breakpoints/scss/settings';

Usage with node-sass-magic-importer

Using node-sass (or a plugin for Grunt, gulp or webpack which is using node-sass) in combination with the node-sass-magic-importer custom importer, can make importing CSS dependencies from node_modules a much nicer experience.

// Import the main file.
@import '~@avalanche/setting-breakpoints';

Usage

// Function.
@media (min-width: setting-breakpoint(m)) { }

// Map.
@media (min-width: map-get($breakpoints, m)) { }

Settings

/// Breakpoint sizes.
/// @type Map
$breakpoints: (
  s: 30em,
  m: 45em,
  l: 60em,
  xl: 75em,
) !default;

About

Author

Markus Oberlehner
Website: https://markus.oberlehner.net
Twitter: https://twitter.com/MaOberlehner
PayPal.me: https://paypal.me/maoberlehner

License

MIT

Keywords

FAQs

What is @avalanche/setting-breakpoints?

Is @avalanche/setting-breakpoints well maintained?

Package last updated on 20 Jul 2018

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install