aboutsummaryrefslogblamecommitdiffstats
path: root/packages/website/ts/components/ui/alert.tsx
blob: 32e0f1be86adde78f7a5c92e307c41bf7e979a8a (plain) (tree)
1
2
3
4
5
6
7
8
9
                                          
                               
                                      


                      
                                      

 
                                             

                                                    

                                                                   









                                                             
  
import { colors } from '@0x/react-shared';
import * as React from 'react';
import { AlertTypes } from 'ts/types';

interface AlertProps {
    type: AlertTypes;
    message: string | React.ReactNode;
}

export const Alert = (props: AlertProps) => {
    const isAlert = props.type === AlertTypes.ERROR;
    const errMsgStyles = {
        background: isAlert ? colors.red200 : colors.lightestGreen,
        color: colors.white,
        marginTop: 10,
        padding: 4,
        paddingLeft: 8,
    };

    return (
        <div className="rounded center" style={errMsgStyles}>
            {props.message}
        </div>
    );
};