1.0.1 • Published 3 years ago

react-profile-image v1.0.1

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

react-profile-image

React Profile Image Component

NPM JavaScript Style Guide

Install

npm install --save react-profile-image

Usage

import React from 'react';
import myImage from './image.png';
import  ReactProfileImage  from 'react-profile-image';

const App = () => {
  return (
      <div style={{ display: "flex" }}>
       <ReactProfileImage imageURL={myImage}/>

       <div style={{ width: "10px" }}/>
        
       <ReactProfileImage
          imageURL={myImage}
          borderColor="#321124"
          imageWidth="150"
          imageHeight="180"
          borderRadius="60"
          hoverEffect={false}
        />

        <div style={{ width: "10px" }}/>

        <ReactProfileImage
          imageURL={myImage}
          borderColor="#66A5CC"
          imageWidth="150"
          imageHeight="150"
          borderWidth="5"
        />

      </div>
       );
}

export default App

Result

Adding hover effect

<ReactProfileImage
  imageURL={photo}
  borderColor="#321124"
  imageWidth="150"
  imageHeight="150"
  borderWidth="3"
  hoverEffect={true}
/>

Properties

PropertieDescription
imageURLThe image
imageWidthThe image's width
imageHeightThe image's height
borderColorThe border color
borderWidthThe border width
hoverEffectThe hover Effect
borderRadiusThe border radius(default 50%)

License

MIT © surajraccha

This project is licensed under the terms of the MIT license.