feat!: rewrite site from scratch with updated ui - #59
Conversation
calebephrem
added
docs
|
Important Review skipped This PR has more than 100 files changed, which exceeds our limit for automatic review. To trigger a single review, invoke the ⚙️ SettingsSeverity Threshold: 📖 User Guide
|
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
|
Note Linting checks passed successfully 🎉 All formatting and code quality checks are clean. You're good to merge 🚀 |
|
Important Review skipped This PR has more than 100 files changed, which exceeds our limit for automatic review. To trigger a single review, invoke the ⚙️ SettingsSeverity Threshold: 📖 User Guide
|
|
Note Linting checks passed successfully 🎉 All formatting and code quality checks are clean. You're good to merge 🚀 |
Summary by BeetleThis PR introduces Lenis smooth scrolling to the website by integrating the Lenis library, a modern smooth scrolling solution. The change wraps the entire application layout with the 📁 File Changes Summary (Consolidated across all commits):
Total Changes: 3 files changed, +14 additions, -7 deletions 🎯 Key Changes:
📊 Impact Assessment:
⚙️ SettingsSeverity Threshold: 📖 User Guide
|
|
✅ You're good to merge this PR! No issues found. Great job! Settings⚙️ SettingsSeverity Threshold: 📖 User Guide
|
|
Note Linting checks passed successfully 🎉 All formatting and code quality checks are clean. You're good to merge 🚀 |
Summary by BeetleThis PR optimizes the application's router performance and theme store hydration by making three key improvements: (1) integrating Lenis smooth scrolling library with proper CSS imports and configuration, (2) restructuring the React layout hierarchy to move 📁 File Changes Summary (Consolidated across all commits):
Total Changes: 4 files changed, +40 additions, -17 deletions 🗺️ Walkthrough:graph TD
A["App Initialization"] --> B["Layout.tsx"]
B --> C["ReactLenis Setup autoRaf: true"]
C --> D["Body Element"]
D --> E["Theme Component"]
E --> F["useTheme.getState() Direct State Access"]
F --> G["loadTheme Function"]
G --> H["Window Check SSR Safe"]
H --> I["requestAnimationFrame"]
I --> J["Set data-theme Attribute"]
J --> K["Update Zustand State"]
K --> L["Lenis Smooth Scroll Active"]
M["globals.css"] -.-> L
M --> N["Lenis CSS Import"]
N --> O["Scrollbar Gutter Stable"]
🎯 Key Changes:
📊 Impact Assessment:
⚙️ SettingsSeverity Threshold: 📖 User Guide
|
|
✅ You're good to merge this PR! No issues found. Great job! Settings⚙️ SettingsSeverity Threshold: 📖 User Guide
|
|
Note Linting checks passed successfully 🎉 All formatting and code quality checks are clean. You're good to merge 🚀 |
Summary by BeetleThis PR restructures the resources catalog by reorganizing language/technology categories and updating resource metadata. The changes consolidate related technologies (e.g., "SQL" → "Database"), enhance resource language tags for better discoverability, and add a new design resource (Reicon). Additionally, minor code cleanup and CSS improvements are included to remove unused variables and improve focus state handling. 📁 File Changes Summary (Consolidated across all commits):
Total Changes: 3 files changed, +69 additions, -20 deletions 🎯 Key Changes:
📊 Impact Assessment:
⚙️ SettingsSeverity Threshold: 📖 User Guide
|
![beetle-ai[bot]](https://avatars.githubusercontent.com/in/1636950?s=60&v=4){kind=small}
| button, | ||
| input, | ||
| textarea:focus { | ||
| outline: none; | ||
| } |
There was a problem hiding this comment.
Removing focus outlines from interactive elements (button, input, textarea) creates a critical accessibility issue. Focus indicators are essential for keyboard navigation and users relying on assistive technologies. This violates WCAG 2.1 Level AA standards (2.4.7 Focus Visible).
Additionally, the selector textarea:focus is inconsistent with button and input (which have no :focus pseudo-class), meaning the outline removal behavior differs across these elements.
Confidence: 5/5
Suggested Fix
Instead of removing focus outlines entirely, consider applying a custom focus style that maintains visibility:
| button, | |
| input, | |
| textarea:focus { | |
| outline: none; | |
| } | |
| button, | |
| input, | |
| textarea { | |
| &:focus { | |
| outline: 2px solid var(--accent); | |
| outline-offset: 2px; | |
| } | |
Or, if you must remove the default outline, replace it with a visible alternative (e.g., box-shadow or border):
| button, | |
| input, | |
| textarea:focus { | |
| outline: none; | |
| } | |
| button, | |
| input, | |
| textarea { | |
| &:focus { | |
| outline: none; | |
| box-shadow: 0 0 0 2px var(--accent); | |
| } | |
Prompt for AI
Copy this prompt to your AI IDE to fix this issue locally:
In app/globals.css around line 137, the CSS rule removes focus outlines from button, input, and textarea elements, which creates an accessibility violation. Replace the outline: none rule with a custom focus style that provides visible focus indicators (e.g., using outline with a custom color, box-shadow, or border), ensuring keyboard navigation remains visible for all users. Make sure the focus style is consistent across all three element types.
📍 This suggestion applies to lines 137-141
|
Note Linting checks passed successfully 🎉 All formatting and code quality checks are clean. You're good to merge 🚀 |
|
Important Review skipped This PR has more than 100 files changed, which exceeds our limit for automatic review. To trigger a single review, invoke the ⚙️ SettingsSeverity Threshold: 📖 User Guide
|
|
Note Linting checks passed successfully 🎉 All formatting and code quality checks are clean. You're good to merge 🚀 |
|
Important Review skipped This PR has more than 100 files changed, which exceeds our limit for automatic review. To trigger a single review, invoke the ⚙️ SettingsSeverity Threshold: 📖 User Guide
|
|
Note Linting checks passed successfully 🎉 All formatting and code quality checks are clean. You're good to merge 🚀 |
1 participant
What does this PR do?
Completely rewrites the website from scratch with completely new ui and code structure
Closes
List any issues that are linked to this pull request (e.g.,
Closes #123)./pages) #45Type of change(s)
Checklist
bun run lintornpm run lintcompletes without warnings or errorsbun run buildornpm run buildcompletes successfullyfeat: ...,fix: ...,chore: ...)console.log)Screenshots / recordings (if applicable)
Anything else the reviewer should know?
Took me alot of time :)