[Product Homepage Design] Implementation#149
Open
yetone wants to merge 13 commits into
Open
Conversation
added 10 commits
May 15, 2026 03:49
Implement the features section of the MirDB homepage with a CSS grid layout displaying four feature cards (memcached protocol, persistent storage, skip-list memtable, automatic compaction). Each card includes an SVG icon, title, and one-line description with 200ms ease hover effects. Includes comprehensive Vitest unit tests covering DOM structure, content verification, CSS grid layout, hover transitions, and responsive breakpoints.
Implement the hero section for the MirDB homepage with an h1 headline, subheadline mentioning memcached protocol, primary "Get Started" CTA linking to #quick-start, secondary "View on GitHub" CTA, and the MirDB logo positioned in the header. Include CSS custom properties in base.css and hero-specific styles with hover/focus states and responsive layout.
Add the resources section with documentation links (API docs, configuration guide, architecture overview), project resource links (GitHub repository, release notes, issue tracker, contribution guidelines), and community support (GitHub Discussions). All external links use target="_blank" with rel="noopener noreferrer".
…ve hamburger menu Implement desktop sticky header, mobile hamburger menu with animations, smooth scroll to sections, keyboard accessibility (Escape key), and ARIA state management for the MirDB homepage navigation.
…nd touch targets Implement responsive CSS covering mobile (<768px), tablet (768-1023px), and desktop (>=1024px) breakpoints. Includes hamburger menu, feature grid column adaptation, touch target minimums (44x44px), logo scaling, code block overflow handling, and smooth breakpoint transitions with prefers-reduced-motion support.
…ebP logo, and lazy loading - Inline critical CSS (base, navigation, hero) in <head> to eliminate render-blocking - Load non-critical CSS asynchronously with media="print" onload pattern - Convert 2.5MB logo.gif to 372B logo.webp for massive size reduction - Add fetchpriority="high" to hero logo for faster LCP - Add noscript fallback for async CSS loading - Add comprehensive performance tests (36 tests covering all 10 test cases) - Update hero and SEO tests to match optimized image format
yetone
force-pushed
the
feature/product-homepage-design-yvcg-5bf3c17
branch
from
74b302b to
a9731d8
Compare
added 3 commits
May 15, 2026 05:29
- Create comprehensive branding.test.js with 37 tests validating: - Logo usage and placement (assets/logo.gif preserved) - Color palette consistency via CSS custom properties - Typography consistency (font tokens, heading hierarchy) - Section vertical spacing on defined scale - Button style consistency (primary/secondary CTAs) - Card style consistency (feature cards) - Transition and state consistency - Fix features.css to remove redundant var() fallback hex values, ensuring all colors are tokenized through base.css custom properties - Add --color-primary-light token to base.css - Fix footer.css to use var(--color-primary-contrast) instead of hardcoded #ffffff for hover state consistency
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.
Summary
This PR implements the requirements for Product Homepage Design.
Generated by Something