Redesign tutorials filter UI with skill tabs, search, and collapsible tags#17579
Merged
Conversation
…tHero Replace the flat wall of ~54 tags with a structured filter UI: - TabNav skill-level selector (All/Beginner/Intermediate/Advanced) with counts and icons - Inline search bar for filtering by title, description, tags, or author - Collapsible topic tags: top 12 by popularity shown by default, rest behind "+N more" - Active filters summary bar with dismissible pills and clear-all - Color-coded skill badges on tutorial cards (green/yellow/red) Modernize the page header using ContentHero with breadcrumbs, doge-computer hero image, and submit button integrated into the hero. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
✅ Deploy Preview for ethereumorg ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
- remove dynamic import - pass label as children
Co-authored-by: Gemini <noreply@google.com>
- Match skeleton loading fallback to actual component layout (max-w-screen-lg, lg breakpoints) - Translate skill name in active filter summary - Add aria-label to search input for screen readers - Fix Text component type (HTMLParagraphElement, not HTMLHeadElement) - Remove redundant array spread in setSelectedTags - Guard skill Tag render against undefined tutorial.skill Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
wackerow
approved these changes
Feb 20, 2026
Merged
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.

Summary
TabNavcomponent from the events pageContentHerowith breadcrumbs, doge-computer hero image, and submit button integrated into the heroBefore
~54 tags displayed as a flat grid with no hierarchy or grouping
After
Structured filter UI with skill tabs, search, and organized topic tags
Preview link
https://deploy-preview-17579.ethereum.it/developers/tutorials
Test plan
/developers/tutorials/and verify the ContentHero renders with doge image and submit button🤖 Generated with Claude Code