feat: show scrollbar on hover

[hyunbinseo]

Hiding Webkit scrollbar cannot be reverted. reference

::-webkit-scrollbar {
  display: none;
}

Therefore, the Webkit scrollbar should be hidden only when it satisfies

• Show scrollbar option is enabled.
• Not using a pointer: fine device.
• The component is not being hovered.

The following code works in Chrome and Firefox, but not in macOS Safari¹.

.scroller-js {
  scrollbar-width: none;
}

@media not (pointer: fine) {
  .scroller-js::-webkit-scrollbar {
    display: none;
  }
}

@media (pointer: fine) {
  .scroller-js:not(:hover)::-webkit-scrollbar {
    display: none;
  }
  .scroller-js:hover {
    scrollbar-width: auto;
  }
}

Footnotes

1. 16.4(18615.1.26.110.1) ↩