Match partner logo wall spacing and sizes to Figma on every breakpoint (CR-130).
Restore asset/Logo import casing so Turbopack can resolve the module, and align the site lockup gaps with the Figma Asset/Logo instances. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -11,16 +11,15 @@ export default {
|
||||
|
||||
## Responsive Behavior
|
||||
|
||||
- **Mobile**: 3 rows × 2 columns grid with 32px gaps
|
||||
- **SM**: 2 rows × 3 columns grid with 48px row gap and 32px column gap
|
||||
- **MD+**: Centered flex-wrap row of logos
|
||||
- **LG**: Larger logo sizes and 64px horizontal padding
|
||||
- **XL**: Largest logo sizes and 160px horizontal padding
|
||||
- **Mobile**: 3 rows × 2 columns grid with 38.4px gaps
|
||||
- **SM**: 2 rows × 3 columns grid with 38.4px gaps
|
||||
- **MD+**: Single space-between row (no wrap)
|
||||
- **LG**: 1.25× logo sizes, 48px gaps, 64px horizontal padding
|
||||
- **XL**: 1.5625× logo sizes, 48px gaps, 160px horizontal padding
|
||||
|
||||
## Animations & Transitions
|
||||
|
||||
- **Fade-in Effect**: Logos fade in from opacity 0 to 60% after component mounts (500ms transition)
|
||||
- **Loading States**: Progressive loading with fallback timer for reliable display
|
||||
- **Opacity**: Partner logos render at 60% opacity to match Figma `Section / Logo Wall`.
|
||||
|
||||
## Props
|
||||
|
||||
@@ -70,7 +69,7 @@ export const Default = {
|
||||
docs: {
|
||||
description: {
|
||||
story:
|
||||
"Default LogoWall with all partner logos. Displays in a 3×2 grid on mobile, 2×3 grid on small screens, single row on medium screens, and larger sizes on large screens. Features a fade-in on mount.",
|
||||
"Default LogoWall with all partner logos. Displays in a 2×3 grid on mobile, 3×2 grid from 430px, and a space-between row from 640px with Figma lockup sizes. Logos render at 60% opacity to match Figma.",
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user