🌈 react-image-shadow
A React image component. Simple realization of image shadow.
📚 Example
Online: https://image-component.github.io/react-image-shadow/
🌀 Template
https://github.com/one-template/react-component-template
📦 Install
npm i react-image-shadow
# or
yarn add react-image-shadow
🎉 Usage
import ImageShadow from 'react-image-shadow';
import 'react-image-shadow/assets/index.css';
const src =
'https://github.com/image-component/gallery/blob/main/girl/1.jpg?raw=true';
export default () => (
<>
<ImageShadow src={src} />
</>
);
📔 API
| Property | Description | Type | Required | Default | Version |
|---|---|---|---|---|---|
| alt | The alt of the image. | string | - | 1.1.0 | |
| className | Component extra class. | string | - | 1.0.0 | |
| shadowBlur | The shadow blur of the image. | number | 20 | 1.0.0 | |
| shadowHover | Whether to support the mouse hover. | boolean | false | 1.0.0 | |
| shadowRadius | The border radius of the image. | number | 8 | 1.0.0 | |
| src | The src of the image. | string | - | 1.0.0 | |
| style | Component extra style. | CSSProperties | - | 1.0.0 | |
| width | The width of the image. | number | 300 | 1.0.0 |
🔨 Development
yarn
yarn start