@forter/scrollbar NPM

fc-scrollbar

An element by Forter

Usage

<script>
   import '@forter/scrollbar';
</script>

<fc-scrollbar style="max-height: 100px; width: 50px;">
   <div style="display: flex; flex-direction: column; background-color: var(--fc-gray-600); color: black;">
     <span>1</span>
     <span>2</span>
     <span>3</span>
     <span>4</span>
     <span>5</span>
     <span>6</span>
     <span>7</span>
     <span>8</span>
     <span>9</span>
     <span>10</span>
   </div>
</fc-scrollbar>

Properties

Property	Attribute	Type	Default	Description
`calculateScrollbarThrottled`		`any`
`dragScrollbarThrottled`		`any`
`horizontal`	`horizontal`	`boolean`	false	Use this attribute to change from vertical to horizontal scrolling.

CSS Custom Properties

Property	Description
`--fc-scrollbar-hover-thumb-background-color`	thumb hover background color. example: `pink`
`--fc-scrollbar-thumb-background-color`	thumb background color. example: `var(--fc-blue-500)`
`--fc-scrollbar-thumb-border-radius`	thumb border radius. example: `0px`
`--fc-scrollbar-thumb-margin`	thumb margin. example: `10px`
`--fc-scrollbar-thumb-width`	thumb width. example: `10px`