@volue/design-media-queries
TypeScript icon, indicating that this package has built-in type declarations

1.3.6 • Public • Published

@volue/design-media-queries

Media query primitives/tokens to be used across Volue's products

Screenshot

Installation

npm install @volue/design-media-queries --save
# or
yarn add @volue/design-media-queries

Usage

JavaScript

In JavaScript, design token names are formatted in lower camelCase.

const tokens = require('@volue/design-media-queries');
console.log(tokens.mqLargeAndUp); // screen and ( min-width: 48.75em )

In JSON, design token names are formatted in SNAKE_CASE.

const tokens = require('@volue/design-media-queries/dist/index.json');
console.log(tokens['MQ_LARGE_AND_UP']); // screen and ( min-width: 48.75em )

Sass

Sass variables and map keys are formatted in kebab-case.

// Using variables
@import '~@volue/design-media-queries/dist/index';

@media #{$mq-large-and-up} {
  body {
    padding: 1rem;
  }
}

Readme

Keywords

none

Package Sidebar

Install

npm i @volue/design-media-queries

Weekly Downloads

620

Version

1.3.6

License

UNLICENSED

Unpacked Size

11.5 kB

Total Files

16

Last publish

Collaborators

  • aleksanderxxx
  • fima1