ui: polish homepage, projects list, and progress page - #288
Open
abderrahim-lectures wants to merge 2 commits into
Open
ui: polish homepage, projects list, and progress page#288abderrahim-lectures wants to merge 2 commits into
abderrahim-lectures wants to merge 2 commits into
Conversation
Give the whole site a more polished, cohesive feel without touching the learning content or the translated strings: - Homepage hero now shows the course's real highlights (10 weeks, project count, zero installs) and uses a gradient that matches the site's violet/amber palette in both light and dark mode. - The real-world projects grid (homepage and the /docs/projects page) can now be filtered by topic with tag chips, and completed projects show a 'Completed' mark and a success-tinted border. - The My Progress page gets an overall progress summary card that combines week completion and project completion into one number. - Cards lift slightly on hover, and keyboard focus is now visible site-wide. English only; translated strings land in a follow-up i18n PR. Co-authored-by: deepseek-v4-flash-free <noreply@opencode.ai>
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.
A whole-app UI polish pass that leaves the learning content and translated strings untouched (English-only; translations land in a follow-up i18n PR).
What changed
PROJECTS, zero installs) and uses a violet→amber gradient that matches the site's existing design tokens in both light and dark mode./docs/projectspage can now be filtered by topic with tag chips (All + each distinct tag). Completed projects show aCompletedmark and a success-tinted border.OverallProgresssummary card combining week completion and project completion into a single percentage with a gradient progress bar.:focus-visible) site-wide.Verification
npm run typecheckpasses.npm run buildpasses for all 4 locales (en/ar/es/fr); the only broken-anchor warnings are the pre-existingdocs-qa-botones already on main.Files:
src/pages/index.tsx,src/pages/index.module.css,src/pages/progress.tsx(+ newprogress.module.css),src/components/ProjectChooser/*,src/css/custom.css.