fix: improve scrollbar and support firefox #51
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
…nto fix-scrollbar
|
Deployment failed with the following error: Learn More: https://vercel.com/microcbers-projects?upgradeToPro=build-rate-limit |
There was a problem hiding this comment.
Pull request overview
This PR improves scrollbar styling by making it more compact and adding Firefox browser support. The changes refactor the scrollbar CSS to use a cleaner pattern with base styles and theme overrides, reduce the scrollbar width from 8px to 4px, and add Firefox-specific scrollbar properties. Additionally, it improves the overflow behavior in the declaration component.
Key changes:
- Added Firefox scrollbar support using
scrollbar-widthandscrollbar-colorproperties - Reduced scrollbar width from 8px to 4px with updated colors for both light and dark themes
- Changed overflow from
scrolltoautoin Decl component for better UX
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| src/styles/custom.css | Refactored scrollbar styles to support Firefox, reduced scrollbar width to 4px, updated colors for both webkit and Firefox browsers |
| src/components/decl-doc/Decl.astro | Changed overflow from scroll to auto to only show scrollbars when needed |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| :root[data-theme="light"] ::-webkit-scrollbar-track { | ||
| background: #f1f1f1; | ||
| ::-webkit-scrollbar { | ||
| width: 4px; |
There was a problem hiding this comment.
[nitpick] The ::-webkit-scrollbar selector only sets the width property for vertical scrollbars. For horizontal scrollbars to match the same thin styling, consider adding height: 4px; as well to maintain consistency.
| width: 4px; | |
| width: 4px; | |
| height: 4px; |
No description provided.