Redesign flashcards for visual hierarchy and button consistency

Study card: label the answer and "key takeaway" as distinct sections
with a real visible divider (previously an all-but-invisible
HSeparator) instead of one undifferentiated block of text. Also fixes
a real gap where a cloze card's extra field was silently dropped,
since only basic notes combined answer+extra into one label. Bigger
card, gradient Show-Answer button matching the app's signature CTA
style instead of a duller flat teal, and the Undo button now hides
itself when there's nothing to undo instead of sitting there disabled
looking identical to a real action.

Library: colored type badge per card (Basic/Cloze) instead of plain
gray text, more breathing room inside each row, Study promoted to the
same gradient CTA style, and Edit/Archive given a real secondary
button treatment instead of default theme buttons. Note editor fields
renamed ("Back / Extra takeaway" + a separate "Extra" field was
genuinely confusing) and now show which deck a card is being saved to.
This commit is contained in:
hz
2026-07-21 22:05:36 -05:00
parent b00b321d6f
commit 7e19366dcb
4 changed files with 182 additions and 38 deletions
+14 -2
View File
@@ -34,19 +34,31 @@ func _initialize() -> void:
_assert(not screen.back_label.visible, "the back should stay hidden before reveal")
screen._reveal()
_assert(screen.back_label.text == "4\n\nBasic arithmetic", "reveal should show the answer plus extra")
_assert(screen.back_label.text == "4", "reveal should show the answer on its own, separate from the extra pearl")
_assert(screen.extra_label.text == "Basic arithmetic" and screen.extra_label.visible, "the extra takeaway should render in its own labeled section")
_assert(screen.answer_caption.visible and screen.extra_caption.visible, "revealing a card with an extra should show both the answer and takeaway captions")
_assert(screen.grade_row.visible, "grading buttons should appear after reveal")
_assert(not screen.reveal_button.visible, "the reveal button should hide once the card is revealed")
_assert(screen.grade_buttons["good"].text.contains("1d"), "each grade button should show its computed next interval")
# Cloze card: only the card's own variant is hidden on the front; back reveals everything.
screen.current_note = {"type": "cloze", "prompt": "{{c1::Paris}} is the capital of France", "answer": "", "extra": ""}
screen.current_note = {"type": "cloze", "prompt": "{{c1::Paris}} is the capital of France", "answer": "", "extra": "European capitals are a classic Step 3 target"}
screen.current_card = {"id": "card-2", "variant": 1, "revision": 1}
screen.revealed = false
screen._render_card()
_assert(screen.front_label.text == "[...] is the capital of France", "cloze front should hide only its own variant")
screen._reveal()
_assert(screen.back_label.text == "Paris is the capital of France", "cloze back should reveal every deletion")
_assert(screen.extra_label.text == "European capitals are a classic Step 3 target" and screen.extra_label.visible,
"a cloze note's extra takeaway should also render (previously silently dropped since only basic notes combined answer+extra into one label)")
# A card with no extra should hide the takeaway section entirely rather than show an empty caption.
screen.current_note = {"type": "basic", "prompt": "What is 1 + 1?", "answer": "2", "extra": ""}
screen.current_card = {"id": "card-3", "variant": 0, "revision": 1}
screen.revealed = false
screen._render_card()
screen._reveal()
_assert(not screen.extra_label.visible and not screen.extra_caption.visible, "a card with no extra takeaway should hide that section instead of showing an empty caption")
screen.free()
quit(1 if failures > 0 else 0)
+2 -2
View File
@@ -99,8 +99,8 @@ func _run() -> void:
study.size = Vector2(1280, 720)
study._update_responsive_layout()
_assert(not study.compact_layout, "a wide viewport should restore the study screen's desktop layout")
_assert(is_equal_approx(study.card_panel.custom_minimum_size.x, 640.0),
"a wide viewport should restore the study card's full 640px width")
_assert(is_equal_approx(study.card_panel.custom_minimum_size.x, 720.0),
"a wide viewport should restore the study card's full 720px width")
study.free()
host.queue_free()