Repository navigation
Labs, Practice, Puzzles, Tutors: one-click filters instead of stacked sections - #186
Merged
Merged
Conversation
One grid of labs under two rows of chips: kind (Visual, Guided, Shell) and topic (System Design challenges and ideas, Cloud and DevOps, Networking). Guided and Shell labs show as Soon and open a short card for what is coming. The chips are links with a query parameter, so a filtered view can be shared. /labs/visual redirects to the visual filter.
Each page had four or five stacked sections. Now a subject, puzzle kind or tutor topic is one tap, and it shows one preview next to a short list of how it works. The longer walkthroughs fold away.
Each tutor is a contact you can call, marked on call. Picking one shows an in-progress call screen: the tutor on the line, a call timer, the sample call as captions, mute, speaker and end controls, and the Call button (opens soon).
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.
The Labs, Practice, Puzzles and Tutors pages each stacked four or five sections of cards. This replaces that with one row of one-click filters and a single result area.
Labs
/labs/visualredirects to/labs?kind=visual; the Visual kind and the "Try a visual lab" links point there.Practice, Puzzles, Tutors
The chips (
components/areas/filter-chips.tsx) are plain links that set a query parameter, so a filtered view can be shared and works before scripts load. They wrap on phones instead of scrolling sideways, so the active chip is always visible.Checked
/labsall,?topic=networking(6 labs),?kind=guided;/practice?subject=networking;/voice?topic=networking. Desktop and 375 px phone, no horizontal scroll.tsc --noEmitclean, eslint clean on the changed files, lab and area unit tests pass (295).