feat: custom scrollbars

[Araxeus]

Closes #1244

Colors could be lighter, and im not sure if raw css is your preferred way of dealing with this, thoughts?

used the colors from https://github.com/gitify-app/gitify/blob/db9733c58211e8946894af2c41f6a0d6856b674d/tailwind.config.js#L12-L15

[setchy]

thanks @Araxeus 👏 would you mind adding a screenshot for light and dark mode 🙏

Colors could be lighter, and im not sure if raw css is your preferred way of dealing with this, thoughts?

What do you think about adding it into index.html directly?

[Araxeus]

Light mode: (didnt touch the style, thats how it natively looks on Windows 10)

  

Dark mode:

  

[setchy]

Looks really nice!

Do you think it's worth making the light theme match the custom scrollbar (with suitable colors)?

[Araxeus]

Do you think it's worth making the light theme match the custom scrollbar (with suitable colors)?

Here are some screenshots of that

  

overall i'd say it looks better than the native one? should i commit this?

[Araxeus]

Well I can't even commit, it looks like its because the change is only affecting an html file, and biome throw an error because it has nothing to check?

[setchy]

Well I can't even commit, it looks like its because the change is only affecting an html file, and biome throw an error because it has nothing to check?

just pushed a fix to our lint-staged config. can you try again now please

[Araxeus]

note: html::-webkit-scrollbar is used because a top level ::-webkit-scrollbar would override the html.dark::-webkit-scrollbar style even with !important

which is a bit sad because it makes the css longer but I don't see a better way to do it

sorry for the double force pushes but i made a typo twice in the commit description 🤦‍♂️

[setchy]

Just sharing an observation... scrollbars are now permanently visible on macOS when there is overflow content.

Previously they would hide/show based on scrolling activity.