Package Exports

react-users-avatar

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-users-avatar) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

React Users Avatar

Install

npm install react-users-avatar --save

Demo

Usage

React users avatar example with image and border

import UserAvatar from 'react-users-avatar';

class ReactUsersAvathar extends Component {
    render() {
        return (
            <UserAvatar 
                imgUrl="https://cdn2.iconfinder.com/data/icons/avatar-2/512/oscar_boy-512.png"
                avatharBgColor="#858aa0"
                avatharTextColor="#fff"
                name="full name"
                border="5px solid #474d56"
                ifBorder
                imgHeight="150px"
                imgWidth="150px"
            />
        );
    }
}

React users avatar example with out image and with out border

import UserAvatar from 'react-users-avatar';

class ReactUsersAvathar extends Component {
    render() {
        return (
            <UserAvatar 
                  avatharBgColor="#858aa0"
                  avatharTextColor="#fff"
                  name="Thamu"
                  border="5px solid #474d56"
                  ifBorder={false}
                  imgHeight="150px"
                  imgWidth="150px"
            />
        );
    }
}

React users avatar example with out image and with border

import UserAvatar from 'react-users-avatar';

class ReactUsersAvathar extends Component {
    render() {
        return (
            <UserAvatar 
                  avatharBgColor="red"
                  avatharTextColor="#fff"
                  name="Nithi"
                  border="5px solid #474d56"
                  ifBorder
                  imgHeight="150px"
                  imgWidth="150px"
            />
        );
    }
}

React users avatar example with out image, with border and with out background

import UserAvatar from 'react-users-avatar';

class ReactUsersAvathar extends Component {
    render() {
        return (
            <UserAvatar 
                  avatharBgColor="#fff"
                  avatharTextColor="green"
                  name="Thamu Nithi"
                  border="5px solid #474d56"
                  ifBorder
                  imgHeight="150px"
                  imgWidth="150px"
            />
        );
    }
}

PROPTYPES

Prop	Type	Default
imgUrl	String	''
avatharBgColor	String	#858aa0
avatharTextColor	String	#fff
name	String	avatar
border	String	5px solid #474d56
ifBorder	Boolean	true
imgHeight	String	150px
imgWidth	String	150px