react-scroll-shadow
TypeScript icon, indicating that this package has built-in type declarations

2.0.2 • Public • Published

react-scroll-shadow Build Status

Pure CSS shadow to indicate more content in scrollable area

demo

Demo 🍿

https://zzarcon.github.io/react-scroll-shadow

Install 🚀

$ yarn add react-scroll-shadow

Usage ⛏

Basic

import ScrollShadow from 'react-scroll-shadow';
 
<ScrollShadow>
  Content
</ScrollShadow>

Custom

import ScrollShadow from 'react-scroll-shadow';
 
<ScrollShadow
  bottomShadowColors={{
    active: 'red',
    inactive: 'white'
  }}
  topShadowColors={{
    active: 'blue',
    inactive: 'white'
  }}
  shadowSize={2}
>
  Content
</ScrollShadow>

Api 📚

interface ShadowColors {
  inactive: string;
  active: string;
}
 
interface Props {
  height?: string;
  bottomShadowColors?: ShadowColors;
  topShadowColors?: ShadowColors;
  shadowSize?: number;
}

See example/ for full example.

Package Sidebar

Install

npm i react-scroll-shadow

Weekly Downloads

48

Version

2.0.2

License

MIT

Unpacked Size

19.3 kB

Total Files

19

Last publish

Collaborators

  • zzarcon