cluedin-widget/core/components/generics/alert.jsx

This project contains all the pages needed for browsing entities and searching them. The aim is to replace the CluedIn.Webapp project with this one when all the pages ( including the Admin page ) will be ported to REACT.

import React, { Component } from 'react';
import radium from 'radium';

const AlertStyle = {
  alert: {
    padding: '15px',
    borderSize: '1px',
    borderStyle: 'solid',
    borderRadius: '4px',
    fontSize: '14px',
  },
  info: {
    color: '#31708f',
    backgroundColor: '#d9edf7',
    borderColor: '#bce8f1',
  },
  danger: {
    backgroundColor: '#F44336',
    color: '#fff',
  },
  warning: {
    backgroundColor: '#FF9800',
    color: '#fff',
  },
  success: {
    backgroundColor: '#009688',
    color: '#fff',
  },
};

class Alert extends Component {
  render() {
    const {type} = this.props;
    let classNames = [AlertStyle.alert];

    if (type === 'danger') {
      classNames.push(AlertStyle.danger);
    } else if (type === 'warning') {
      classNames.push(AlertStyle.warning);
    } else if(type==='success') {
      classNames.push(AlertStyle.success);
    } else {
      classNames.push(AlertStyle.info);
    }

    return (<div style={classNames}>
      {this.props.children}
    </div>);
  }
}

export default radium(Alert);