Scrollable custom bar hiding Windows scrollbars and overlaying scrollbars on top

scroll.scss

.scrollable-y-with-hide {
  overflow-y: hidden;
  &:hover {
    overflow-y: auto;
    // https://stackoverflow.com/a/54979559/375050
    // only for WebKit so that scrollbars do not take space and cause content to overflow
    overflow-y: overlay;
  }
  &::-webkit-scrollbar-thumb {
    background: hsla(0%, 0%, 0%, 0.4);
  }

  &::-webkit-scrollbar {
    height: 8px;
    width: 8px;
  }

}