react-cosmos-background-proxy

Easily apply a background for a fixture's playground and load global css

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
react-cosmos-background-proxy
1.0.15 years ago5 years agoMinified + gzip package size for react-cosmos-background-proxy in KB

Readme

react-cosmos-background-proxy
Easily apply both global and fixture specific background settings for react-cosmos

Installation

npm install --save-dev react-cosmos-background-proxy

Usage

Basic

// cosmos.proxies.js
import createBackgroundProxy from 'react-cosmos-background-proxy';

export default [createBackgroundProxy()];

// __fixtures__/example.js
export default {
  component: MyComponent,
  // will apply this style to the <body> element of the fixture iFrame
  background: {
    backgroundColor: 'white'
  }
};

Global Styling

// cosmos.proxies.js
import createBackgroundProxy from 'react-cosmos-background-proxy';

export default [
  createBackgroundProxy(() => {
    // this will be invoked once when the playground is loaded
    require('node_modules/some-css-framework/dist/styles.css');
  })
];

Contributions are more than welcome! :beers: