feat: add styled 404 page with custom pill header and bunny mascot #745
Conversation
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
- Implemented custom 404 page with Keploy branding - Added floating pill header with Technology, Community, and Resources links - Included VS Code and GitHub badges in the custom header - Added search button logic to trigger DocSearch - Created custom SVG illustration of Keploy bunny mascot - Implemented logic to hide global Docusaurus components on 404 route - Ensured responsive design for mobile and desktop Fixes keploy/keploy#3441 Signed-off-by: Bhanu Reddy <[email protected]>
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
Achanandhi-M
requested changes
Jan 6, 2026
Member
There was a problem hiding this comment.
Hey @bhanreddy1973, we don’t want to make any design changes in the docs header—please focus only on fixing the 404 issue. The redirection should point to /docs/; we don’t want to show any separate page.
Additionally, please include a short video demonstrating your changes and make sure to fix all the failing pipelines.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
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.
What has changed?
This PR implements a custom, branded 404 page for the Keploy documentation website as requested in Issue #3441.
Summary of Changes:
Fixes keploy/keploy#3441
Type of change
How Has This Been Tested?
Tested locally using
npm startand visiting non-existent URLs like/docs/xyz.Screenshots:
404 Page (Desktop View):
404 Page (Mobile View):
Build Output:
npm run build
Build completed successfully## Checklist:
Files Changed:
src/theme/NotFound/index.js- Layout wrapper with noNavbar/noFooter propssrc/theme/NotFound/Content/index.js- Main 404 page UI and logic (custom header + theme toggle + slack button + illustration)src/css/custom.css- CSS rules to hide global Docusaurus components