Add dark mode, custom mouse, and parallax effects#57
Merged
Conversation
There was a problem hiding this comment.
Pull request overview
Note
Copilot was unable to run its full agentic suite in this review.
This PR introduces site-wide UI enhancements: a dark mode color palette with a nav toggle, richer motion effects on key components, and a global custom cursor.
Changes:
- Add Theme UI dark mode colors and a header toggle to switch color modes.
- Replace CSS-only hover effects with JS-driven parallax/tilt interactions in the Slack page UI.
- Add a global custom cursor mounted from
_app.js.
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 6 comments.
Show a summary per file
| File | Description |
|---|---|
| pages/index.js | Removes forced light theme and adds mouse-driven tilt interactions to cards; tweaks timeline border color token. |
| pages/_app.js | Mounts the new global CustomCursor component for all pages. |
| lib/theme.js | Adds Theme UI dark mode palette and sets initial color mode to light. |
| components/slack/header.js | Adds scroll parallax + button tilt interactions using refs/effects and forwardRef cover. |
| components/nav.js | Adds Theme UI color mode toggle button and link underline hover styling. |
| components/custom-cursor.js | Implements a global animated custom cursor and hides the native cursor. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
|
||
| return ( | ||
| <> | ||
| <style>{`* { cursor: none !important; }`}</style> |
Collaborator
|
Hi Evan,
|
Contributor
Author
|
Hey Evan, Regards, |
Member
fix the conflicts
|
Comment on lines
+143
to
+145
| const cardRef = useRef(null) | ||
| const prefersMotion = usePrefersMotion() | ||
| const rafRef = useRef(null) |
| ) | ||
|
|
||
| const Cover = () => ( | ||
| const Cover = React.forwardRef((props, ref) => ( |
Comment on lines
+170
to
+174
| ref={btnRef} | ||
| as="button" | ||
| onClick={onJoinClick} | ||
| onMouseMove={onBtnMouseMove} | ||
| onMouseLeave={onBtnMouseLeave} |
Comment on lines
+228
to
+230
| onClick={() => setColorMode(colorMode === 'dark' ? 'light' : 'dark')} | ||
| aria-label="Toggle dark mode" | ||
| sx={{ |
| "@types/react": "^19.2.14", | ||
| "eslint": "^10.0.3", | ||
| "eslint-config-next": "^16.2.1", | ||
| "playwright": "^1.60.0", |
Comment on lines
+171
to
+179
| const handleMouseLeave = prefersMotion | ||
| ? () => { | ||
| const el = cardRef.current | ||
| if (!el) return | ||
| el.style.transition = 'all 0.4s ease-in-out' | ||
| el.style.transform = '' | ||
| el.style.boxShadow = '' | ||
| } | ||
| : undefined |
Comment on lines
+299
to
+306
| const handleBtnMouseLeave = prefersMotion | ||
| ? () => { | ||
| const el = btnRef.current | ||
| if (!el) return | ||
| el.style.transition = 'transform 0.4s ease, box-shadow 0.125s ease-in-out' | ||
| el.style.transform = '' | ||
| } | ||
| : undefined |
Comment on lines
+248
to
+250
| const hasMounted = useHasMounted() | ||
| const prefersMotion = usePrefersMotion() | ||
| const coverRef = useRef(null) |
EvanStreams
added a commit
that referenced
this pull request
Jun 6, 2026
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
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.
No description provided.