Fix widget layout clipping and add comprehensive widget previews
- Fix LargeVotingView mood icons getting clipped at edges by using flexible HStack spacing with maxWidth: .infinity - Fix VotingView medium layout with smaller icons and even distribution - Add comprehensive #Preview macros for all widget states: - Vote widget: small/medium, voted/not voted, all mood states - Timeline widget: small/medium/large with various data states - Reduce icon sizes and padding to fit within widget bounds - Update accessibility labels and hints across views 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -491,6 +491,7 @@
|
||||
.feature-icon.purple { background: rgba(168, 85, 247, 0.15); }
|
||||
.feature-icon.red { background: rgba(248, 113, 113, 0.15); }
|
||||
.feature-icon.gray { background: rgba(148, 163, 184, 0.15); }
|
||||
.feature-icon.cyan { background: rgba(34, 211, 238, 0.15); }
|
||||
|
||||
.feature-card h3 {
|
||||
font-size: 1.125rem;
|
||||
@@ -956,6 +957,11 @@
|
||||
<h3>Privacy First</h3>
|
||||
<p>Your feelings stay yours. All data lives on your devices with iCloud sync.</p>
|
||||
</div>
|
||||
<div class="feature-card reveal">
|
||||
<div class="feature-icon cyan">♿</div>
|
||||
<h3>WCAG 2.1 AA Accessible</h3>
|
||||
<p>Built for everyone. Full VoiceOver support, Dynamic Type, and high contrast ensure no one is left behind.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user