Fix demo page anti-slop violations (emoji badge, feature-card wall) - #13
Merged
Conversation
The Calmly demo failed the skill's own anti-slop checklist. Two concrete fixes: - Replace the hero badge emoji (a literal leaf emoji) with a real inline leaf SVG in the page's own flat-illustration style. The checklist says "no emoji as icons"; the demo was doing exactly that. - Rework the three identical centered feature cards into an asymmetric layout: one lead feature (the core "ten minutes" promise) with real weight and a left-aligned visual, plus a supporting pair below. This breaks the uniform feature-card wall the checklist warns about and adds intentional hierarchy instead of three same-shaped boxes. Also removes em-dashes from the demo copy. Out of scope here and tracked under #7: the mono body copy and pill eyebrow tells on the marketing page, which touch the Technical/builder preset itself rather than just this page. Refs #6
This was referenced Jul 20, 2026
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.
Closes #6 (partial: demo page).
What this fixes
Issue #6 flagged that the pages representing the product fail the skill's own
references/anti-slop-checklist.md. This PR fixes the two clearest, unambiguous violations on the demo page (site/demo.html), which is the page reviewers specifically dissected.1. Emoji as an icon (checklist: "No emoji as icons")
The hero badge was a literal leaf emoji:
Replaced with a real inline leaf SVG drawn in the page's own flat-illustration style (same palette as the hero art), so the badge uses a real asset instead of an emoji standing in for an icon.
2. The uniform feature-card wall (checklist: "Shows, don't tell / vary rhythm")
The section was three identical centered cards, each icon + heading + one sentence. Reworked into an asymmetric layout:
This gives the section real hierarchy and rhythm instead of three same-shaped boxes, which is what the checklist's "vary rhythm" note asks for.
Also
Before / after
🌿emojiScope
Deliberately focused on the demo page. Out of scope, tracked under #7: the mono body copy and pill eyebrow labels on the marketing page (
site/index.html), because those implicate the Technical/builder preset itself, not just this page, and need the checklist expansion in #7 first. So this PR does not fully close #6; it clears the concrete demo-page violations and leaves the marketing-page tells for the #7 follow-up.Verification
site/demo.html.Deploy
The live site deploys manually from
site/after merge, so this PR does not touch production. Deploy follows merge tomain.