Add interactive homepage with playful design#21
Merged
buurro merged 9 commits intobuurro:mainfrom Dec 31, 2025
Merged
Conversation
- Add landing page at / with Tailwind CSS styling - Pink/yellow color scheme inspired by Super Hello design - Hero section, features, and "How it works" cards - Interactive "Try it" section that queries the API: - Package input with version specifier support - Shows nixpkgs revision info (commit, hash, date) - Displays ready-to-use nix run/shell commands with copy buttons - Shows syntax-highlighted flake.nix preview using Prism.js
- Add Bricolage Grotesque + DM Sans typography - Implement warm pink/golden yellow color scheme - Add organic wave dividers between sections - Create custom SVG icons for "How it works" cards with decorative lines - Style code blocks as macOS-like windows with traffic lights - Add interactive "Try it" section with: - Animated gradient background with pulsing effect - Floating decorative icons (fixed position) - Glowing animated border on the card - Terminal-style input with $ prefix - Pulse button with glow hover effect - Gradient command blocks with copy buttons - Syntax-highlighted flake.nix preview - Add hover animations on cards - Implement sticky navigation with backdrop blur
Extract inline HTML from main.py into templates/index.html for better maintainability and separation of concerns.
Extend SVG viewBox and path above visible area to eliminate anti-aliasing gap between sections.
Use a background rect + wave path in each SVG to ensure complete color coverage and eliminate rendering gaps.
- Replace generic icons with contextual ones: - Package box with version tag for Request - Git history timeline with magnifying glass for Resolve - Terminal window with play button for Run - Add numbered step badges (1, 2, 3) - Add gold gradient background to icon boxes - Remove dated dashed line decoration
buurro
approved these changes
Dec 31, 2025
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
2 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.
Summary
/with Tailwind CSS stylingFeatures
nix runandnix shellcommands with copy buttonsTest plan
/and verify homepage renders correctlypython3~=3.11ornodejs