0.2.1 • Published 8 years ago

department-notifications v0.2.1

Weekly downloads
1
License
MIT
Repository
github
Last release
8 years ago

Department Notifications Package

Drop in redux notifications for department.

Demo

Installation

npm i department-notifications --save

Usage

The package is based on redux, so you need to use the notificationsReducer in your store. Then you need to import the Notifications component somewhere near the root element.

const reducer = combineReducers({
  notifications: notificationsReducer
})

const App = () => (
  <section>
    <Notifications />
    <section className="contents">
      <p>App</p>
    </section>
  </section>
)

You can check the example directory for a small example.

Styling

There is an optional scss file, it is recommended to import it.

@import '~department-notifications/styles/notifications';

Sass variables

VariableValue
$notifications-width300px
$notifications-corner-offset20px
$notifications-font-size1.3
$notifications-font-weight600
$notifications-padding12px 17px
$notifications-border-radius3px
Colors
$notifications-primary-bg-color#3598CF
$notifications-primary-color#FFFFFF
$notifications-success-bg-color#1AB342
$notifications-success-color#FFFFFF
$notifications-warning-bg-color#FF9800
$notifications-warning-color#FFFFFF
$notifications-danger-bg-color#F33534
$notifications-danger-color#FFFFFF

Packages used:

  • js
    • redux (notifications store)
    • react-addons-css-transition-group (notifications animations)
  • css
    • department-base (common styles)

License

MIT