feat: add custom themed scrollbar styling for dark and light modes - #540
Open
MahithaJV wants to merge 1 commit into
Open
feat: add custom themed scrollbar styling for dark and light modes#540MahithaJV wants to merge 1 commit into
MahithaJV wants to merge 1 commit into
Conversation
- Added thin 8px scrollbar with rounded edges for a modern look - Scrollbar thumb uses accent red color (--primary-color) with opacity variants - Supports hover and active states with smooth color transitions - Dark mode: subtle translucent red thumb on near-transparent track - Light mode: softer red thumb on light track for readability - Cross-browser: WebKit pseudo-elements + Firefox scrollbar-width/scrollbar-color - Uses CSS custom properties for seamless theme toggle support
|
@MahithaJV is attempting to deploy a commit to the 007's projects Team on Vercel. A member of the Team first needs to authorize it. |
Thanks for creating a PR for your Issue!
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Added thin 8px scrollbar with rounded edges for a modern look
Scrollbar thumb uses accent red color (--primary-color) with opacity variants
Supports hover and active states with smooth color transitions
Dark mode: subtle translucent red thumb on near-transparent track
Light mode: softer red thumb on light track for readability
Cross-browser: WebKit pseudo-elements + Firefox scrollbar-width/scrollbar-color
Uses CSS custom properties for seamless theme toggle support
Which issue does this PR close?
We generally require a GitHub issue to be filed for all bug fixes and enhancements and this helps us generate change logs for our releases. You can link an issue to this PR using the GitHub syntax. For example
Closes #123indicates that this PR will close issue #123.Rationale for this change
Why are you proposing this change? If this is already explained clearly in the issue then this section is not needed.
Explaining clearly why changes are proposed helps reviewers understand your changes and offer better suggestions for fixes.
What changes are included in this PR?
There is no need to duplicate the description in the issue here but it is sometimes worth providing a summary of the individual changes in this PR.
Are these changes tested?
We typically require tests for all PRs in order to:
If tests are not included in your PR, please explain why (for example, are they covered by existing tests)?
Are there any user-facing changes?
If there are user-facing changes then we may require documentation to be updated before approving the PR.