@pismo/bolt-colors

0.0.1-32 • Public • Published

Bolt Colors

Installation

> yarn add @pismo/bolt-colors

Usage

CSS-in-JS

If you are have a sass-loader prepared to import .scss files from your node_modules and want to apply the global stylesheet that this package offers, simply import it, once, directly inside your JavaScript and let your bundler do the work for you:

MyApp/index.js:

import '@pismo/bolt-colors/index.scss'

You can name the import to make use of the same variables declared in the SCSS files, but in your JS:

MyButton.js:

import colors from '@pismo/bolt-colors'

const btnStyle = {
  backgroundColor: colors.blue,
}

const MyButton = () => (
  <Button style={btnStyle}>Bolt blue!</Button>
)

Using the variables inside your own SCSS/SASS

In this case you just need to import the specific file that contains the variables you want to reuse in your .scss.

MyApp/style.scss:

@import '~@pismo/bolt-colors/index.scss';

.my-class {
  color: $blue;
  border-color: $dark-blue;
  background-color: $near-white;
}

e.g.: We're using the $blue, $dark-blue and $near-white variables of @pismo/bolt-colors. Pro-tip: You can import specific color palettes, like so:

@import '~@pismo/bolt-colors/_red'

Development

Edit the .scss files. All the JS files are generated automatically upon commit.

Readme

Keywords

Package Sidebar

Install

npm i @pismo/bolt-colors

Weekly Downloads

26

Version

0.0.1-32

License

ISC

Last publish

Collaborators

  • aryang-pismo
  • mateus_bombassaro
  • fabio-rizzi_pismo
  • vinicius_vieira
  • abraaobueno
  • fagner.pelicioni
  • rodribeze
  • victorwpbastos
  • pismojosh
  • jonathanleahypi
  • wkerswell-pismo
  • davi.firmino
  • henrique.nunes
  • dandwal
  • giovanniprosim
  • gabriel.miguel
  • leandro.almeida.pismo
  • caique.constant
  • aline.souza
  • clint_roberts
  • marykay.grueneberg
  • rasienko
  • filipe.lyra
  • chrcarlos.rodrigues
  • timothy.robinson
  • tiffany.long
  • lcavalca
  • roberta.furlan
  • kmelnick
  • raphaelhernandocosta
  • thiagoribeirop
  • anne-gentle_pismo