Component that customizes the list and inserts shadow when scrolling exists
npm i react-shadow-scroll
// OR
yarn add react-shadow-scroll
Demo Link
Local demo:
git clone https://github.com/andrelmlins/react-shadow-scroll.git
cd react-shadow-scroll
npm install && npm run start
import React from 'react';
import { render } from 'react-dom';
import ReactShadowScroll from 'react-shadow-scroll';
const App = () => (
<ReactShadowScroll>
<ul>
<li>Teste</li>
<li>Teste</li>
<li>Teste</li>
<li>Teste</li>
</ul>
</ReactShadowScroll>
);
render(<App />, document.getElementById('root'));
Raw component props (before transform):
Prop | Default | Type | Description |
---|---|---|---|
scrollColor | #c5c5c5 | string | Scroll color |
scrollColorHover | #a6a6a6 | string | Scroll color when hover |
scrollWidth | 5 | number | Scroll Width |
scrollPadding | 0 | number | Left scroll padding |
isShadow | true | boolean | View shadow |
shadow | '0 2px 4px rgba(0, 0, 0, 0.2) inset, 0 -2px 4px rgba(0, 0, 0, 0.2) inset' | string | Shadow |
styleSubcontainer | null | object | Style in Subcontainer |
Download stats for this NPM package
React Shadow Scroll is open source software licensed as MIT.