-
Notifications
You must be signed in to change notification settings - Fork 1
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feature/scrollbar-gradient #30
base: beta-1.0
Are you sure you want to change the base?
Conversation
@varlevi : Rebased off of beta and fixed conflicts. This is ready for a review. |
Hmm... the site will no longer open on Firefox. It just loads up a blank page. Also, in Chrome and Vivaldi it's not showing up as a gradient, just the lightest shade of the color. At this point, I wondering if this is best held off until I've developed a way for the user to turn off this feature as well, because for some I can see how this might be distracting. (Might be a good button to put in the settings pane in #26.) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I addressed this in the issue connected, but just realized I never reviewed. Sorry! As I explained in the issue, this PR doesn't appear to work in Firefox or Safari, and only partially works in Chrome (not a gradient, just one color). In addition, after thinking it over, I'm thinking it might be better to implement this feature after there is a way for the user to turn it on and off, because while I could find myself using this, I can also see some others finding it distracting. I hope you understand. I probably should have thought about it before I made the issue and not after you took the time to write this code. However, I've shelved this so that we can implement it a little later if we want.
const endColor = colors[colors.length - 1].style.backgroundColor; | ||
const styleTag = document.createElement("style"); | ||
|
||
const trackStyle = ` |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This doesn't appear to be styling the scrollbar with a gradient on Chrome.
Hi @cdrani! So I've thought about this feature for a bit now and have come up with a design that I think will fit better with the site. However, it will involve a lot more customization than your PR. I'm thinking it will be a good feature to release in v1.0.0 alongside the site redesign planned in #51. Below I've attached a prototype image of what I think the scrollbar should look like and would love your feedback. If your still up for it, I'd be happy if you want to tackle this feature again, but if not, I totally understand. Life is crazy right now for everyone and I'm sure you are very busy! I will also attach some of this information to the corresponding issue. Thanks for all the contributions you've made to this project! |
Note: This PR is rebased off of #29 so it would wise to merge that one in prior to this one.
Dynamically generate scrollbar styles based on card colors. Note that scrollbar styles are only supported on blink and webkit based browsers like chrome & safari.
Firefox doesn't seem to be supported currently in my estimation as tested on FireFox Developer Edition.Updated with Firefox's
scrollbar-color
property, however it doesn't allow using a linear-gradientcolor so colors are the first card color for the track and the last card color for the thumb.
Feel free to adjust the styling to your liking.
closes #22