Skip to content

jyotirmaybanerjee/tango-ui

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

tango-ui

A slick UI component library for react

Demo

Installation

npm install tango-ui --save

Usage

import { NavBar, RaisedButton, FloatingActionButton, Tags } from 'tango-ui';
<NavBar
  brand="Tango UI"
  links={[
      { url: "/members", label: "Members" },
      { url: "/projects", label: "Projects" },
      { url: "/users", label: "Users" },
      { url: "/login", label: "Login" }
      ]} />

Alt text

<RaisedButton style={{margin: "12px"}}> Default </RaisedButton>

<RaisedButton style={{margin: "12px"}} primary="true"> Primary </RaisedButton>

<RaisedButton style={{margin: "12px"}} secondary="true"> Secondary </RaisedButton>

<RaisedButton style={{margin: "12px"}} disabled="true"> Disabled </RaisedButton>

Alt text

<RaisedButton style={{margin: "12px"}} primary="true" fullWidth="true"> Primary + Full Width </RaisedButton>

Alt text

<FloatingActionButton> <i className="fa fa-plus"></i> </FloatingActionButton>

<FloatingActionButton primary="true"> <i className="fa fa-plus"></i> </FloatingActionButton>

<FloatingActionButton secondary="true"> <i className="fa fa-minus"></i> </FloatingActionButton>

<FloatingActionButton disabled="true"> <i className="fa fa-plus"></i> </FloatingActionButton>

Alt text

<Tags value={this.state.simpleTags} onChange={::this.handleSimpleTagChange} />

Alt text

Tests

npm test

Contributing

In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code.

Release History

  • 0.0.4 Initial release