hover scroll

scrollable.css

/*******************
 * Scrollbar
 *******************/

/** Scrollbar style override */
.scroller {
  overflow-x: hidden;
  overflow-y: scroll;
  border-color: rgba(0, 0, 0, 0);
  transition-timing-function: ease-in-out;
  transition-duration: 200ms;
  transition-property: border-color;
  border-color: rgba(0, 0, 0, 0);
}

/** Scrollbar hover */
.scroller:hover {
  border-color: rgba(0, 0, 0, 0.15);
}

/** Scrollbar border */
.scroller::-webkit-scrollbar,
.scroller::-webkit-scrollbar-thumb,
.scroller::-webkit-scrollbar-corner {
  border-color: inherit;
  border-right-width: calc(100vw + 100vh);
  border-right-style: inset;
}

/** Scrollbar track */
.scroller::-webkit-scrollbar {
  width: 7px;
  height: 7px;
  border-color: rgba(0, 0, 0, 0);
}

/** Scrollbar thumb */
.scroller::-webkit-scrollbar-thumb {
  border-color: rgba(0, 0, 0, 0.1);
  border-color: inherit;
  border-radius: 100px;
}