1
0
mirror of https://github.com/yldio/copilot.git synced 2024-11-14 23:30:05 +02:00
copilot/ui/src/components/notification
2017-01-11 14:22:42 +00:00
..
index.js making notifcations closable by adding function to props 2017-01-11 11:59:06 +00:00
readme.md removing clearfix and updating component 2016-11-29 14:11:32 +00:00
story.js moving stories to directory folders 2017-01-11 14:22:42 +00:00

<Notification>

demo

const React = require('react');
const ReactDOM = require('react-dom/server');
const Base = require('../base');
const Container = require('../container');
const Row = require('../row');
const Column = require('../column');
const Notificaton = require('./index.js');
const styles = require('./style.css');

const style = {
  marginBottom: 0
}

nmodule.exports = ReactDOM.renderToString(
  <Base>
    <Row>
      <Column>
        <Notificaton type='warning' icon='exclamation'>
          <p style={style}>This is the warning content</p>
        </Notificaton>
      </Column>
    </Row>
    <Row>
      <Column>
        <Notificaton type='warning' icon='question'>
          <p style={style}>This is the question content</p>   
        </Notificaton>
      </Column>
    </Row>
    <Row>
      <Column>
        <Notificaton type='alert' icon='exclamation'>
          <p style={style}>This is the alert content</p>   
        </Notificaton>
      </Column>
    </Row>
  </Base>
);

usage

const React = require('react');
const Notificaton = require('ui/avatar');

module.exports = () => {
  return (
    <Notificaton type='warning' icon='question'>  
      <p>This is the warning content</p>
    </Notificaton>
    <Notificaton type='warning' icon='question'>
      <p>This is the question content</p>
    </Notificaton>
    <Notificaton type='alert' icon='exclamation'>
      <p>This is the alert content</p>
    </Notificaton>
  );
}