Skip to content

style: deepen MCQ correct-row tint#2436

Merged
aalemayhu merged 1 commit into
mainfrom
style/mcq-row-tint
May 18, 2026
Merged

style: deepen MCQ correct-row tint#2436
aalemayhu merged 1 commit into
mainfrom
style/mcq-row-tint

Conversation

@aalemayhu
Copy link
Copy Markdown
Contributor

@aalemayhu aalemayhu commented May 18, 2026

What

Deepen the success-row background on the back of a multiple-choice card from #ECFDF5 (Tailwind green-50) to #A7F3D0 (green-200), and add a 3px inset green left rule (#10b981) so the correct option reads as the dominant row at a glance.

Why

Follow-up to #2430. Al flagged that the original tint was too pale to make the right answer visibly pop next to the other choices on review — the marker alone was carrying the signal. Deeper green + a left rule reads instantly without changing the layout or the spacing.

How

  • src/templates/n2a-mcq.jsonli.row-success { background: #A7F3D0; box-shadow: inset 3px 0 0 #10b981; }
  • Dark-mode #064e3b was already strong enough — left untouched.
  • Updated the Python assertion in create_deck/helpers/test_get_model_mcq.py that checks the row colour shipped in the model.
  • One changelog entry: "Multiple choice cards — correct rows stand out with a deeper green tint and a green rule on the left".

Testing

  • python3 -m pytest create_deck/helpers/test_get_model_mcq.py — 14 passed.
  • Visual check on the back of an MCQ card pending after merge — purely a CSS shift; no JS or rendering logic touched.

Risks

Cosmetic-only change inside one template's styling field. No code paths, no API, no DB. Bounded blast radius.

Goal alignment

Makes the back of an MCQ card easier to read at a glance — the correct answer is supposed to be the first thing you see. Direct hit on "beautiful Anki flashcards".

🤖 Generated with Claude Code


View in Codesmith
Need help on this PR? Tag @codesmith with what you need.

  • Let Codesmith autofix CI failures and bot reviews

The success row on the back of a multiple-choice card used #ECFDF5
(Tailwind green-50) which Al found too pale to make the right answer
visibly pop next to its neighbours. Bump it to #A7F3D0 (green-200)
and add a 3px inset green left rule (#10b981) so the correct option
reads as the dominant row from across the deck.

Dark-mode #064e3b is already strong enough — left it untouched.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@netlify
Copy link
Copy Markdown

netlify Bot commented May 18, 2026

Deploy Preview for notion2anki ready!

Name Link
🔨 Latest commit fc44536
🔍 Latest deploy log https://app.netlify.com/projects/notion2anki/deploys/6a0b85091d4c9f0007313017
😎 Deploy Preview https://deploy-preview-2436--notion2anki.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

@aalemayhu aalemayhu merged commit 9a6f4ca into main May 18, 2026
17 checks passed
@aalemayhu aalemayhu deleted the style/mcq-row-tint branch May 18, 2026 21:32
@sonarqubecloud
Copy link
Copy Markdown

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant