react-sf-themes

Color theme for the Superflows component system

On This Page

• Introduction
• How It Works
• Colors
• Quickstart
• Customization
• Tests

Introduction

Use this package to access the default color theme provided by Superflows. Then customize it further by changing the default color values to suit your UI.

How It Works

Customization works as follows:

• Access the default color theme using this package
• Modify the colors as per your requirement
• Pass the modified theme to your Superflows components

Colors

Types of Colors

Superflows is designed using Bootstrap, naturally the color theme follows the Bootstrap's default color theme as well. Following color-types are defined:

Primary Color Secondary Color Danger Color Success Color Warning Color Info Color Light Color Dark Color

Color Values

Following color values are defined by default:

Quickstart

Installation

npm install --save react-sf-themes

Usage

import React from 'react'
import Themes from 'react-sf-themes'

const App = () => {

  console.log('Themes', Themes.getTheme());

  return <div></div>
}

export default App

Tests

How To Run

To run tests locally:

npm tests

Results

PASS src/index.test.tsx

• Themes
  • ✓ Render (3ms)

-----------|----------|----------|----------|----------|-------------------|

License

MIT © superflows-dev