@boomerang-io/styles

1.1.0 • Public • Published

Styles

A package for including a css reset, IBM Design Language Color Library scss functions, and scss variables for fonts and colors

What it does

// IBM Design Language
$__ibm-color-palettes: (
  'blue': (
    1: #e1ebf7,
    10: #c8daf4,
  )
);

// @boomerang/boomerang-styles color palette to variable mapping
$blue-1: #e1ebf7;
$blue-10: #c8daf4;

Install

yarn add @boomerang/boomerang-styles
or
npm install @boomerang/boomerang-styles

Use

// styles.scss 
// base stylesheet for the application - includes resets
@import "~@boomerang/boomerang-styles";
 
// button.scss
@import "~@boomerang/boomerang-styles/lib/colors"; // import the color variables
 
 
.button {
  background: $blue-90; // use color variable
}


.button--disabled {
  background: color('blue', 90, $alpha: 0.5); // use IBM Design Language function
}

Requirements

  • local configured to use @boomerang scoped npm packages. See our getting started guide for more information
  • any Sass compiler compatible with Sass 3.3 or greater.

Readme

Keywords

Package Sidebar

Install

npm i @boomerang-io/styles

Weekly Downloads

131

Version

1.1.0

License

Apache-2.0

Unpacked Size

24.3 kB

Total Files

10

Last publish

Collaborators

  • timrbula
  • tysonlawrie
  • benjamin-ruby
  • isa-kawa
  • lucasgrimauth