Rework flashcards library to match the rest of the app's visual language
Compared side-by-side against Dashboard, the library screen used entirely different visual primitives: a gradient primary button Dashboard doesn't use anywhere, per-row bordered cards with low contrast against the dark background, and a translucent pill badge instead of the icon-circle pattern used everywhere else (stat tiles, review queue, recent activity). - Study/Save/Commit import now use Dashboard's actual primary button style (flat ROYAL_BLUE, not the login/session-dialog gradient) - Added a stat-tile row (Due today / New available / Decks) using Dashboard's exact icon-circle + value + label construction, replacing the due/new counts previously crammed into the deck dropdown's text - The note list now lives in one bordered card with a section title (matching Dashboard's chart/list panels) instead of each row being its own separate low-contrast card - Per-row card-type indicator is now an icon circle (clipboard-list / notebook-pen) matching the Recent Activity list pattern, instead of a translucent color-coded pill badge
This commit is contained in:
@@ -34,17 +34,23 @@ func _run() -> void:
|
||||
theme_service.set_dark_mode(true)
|
||||
hub._render_notes()
|
||||
await process_frame
|
||||
var dark_card := hub.list_container.get_child(0) as PanelContainer
|
||||
var dark_box := dark_card.get_theme_stylebox("panel") as StyleBoxFlat
|
||||
_assert(dark_box.bg_color.is_equal_approx(Brand.content_card_box(true, false, Brand.ROYAL_BLUE).bg_color),
|
||||
"flashcard note cards should use the dark surface while dark mode is active")
|
||||
var dark_list_box := hub.list_card.get_theme_stylebox("panel") as StyleBoxFlat
|
||||
_assert(dark_list_box.bg_color.is_equal_approx(Color("081426")),
|
||||
"the flashcards list card should use the dark surface while dark mode is active")
|
||||
var dark_row := hub.list_container.get_child(0) as BoxContainer
|
||||
var dark_icon_box := (dark_row.get_child(0) as PanelContainer).get_theme_stylebox("panel") as StyleBoxFlat
|
||||
_assert(dark_icon_box.bg_color.is_equal_approx(Brand.icon_circle_box(true, Brand.ROYAL_BLUE, 20).bg_color),
|
||||
"a basic card's type icon should use its dark accent styling")
|
||||
|
||||
theme_service.set_dark_mode(false)
|
||||
await process_frame
|
||||
var light_card := hub.list_container.get_child(0) as PanelContainer
|
||||
var light_box := light_card.get_theme_stylebox("panel") as StyleBoxFlat
|
||||
_assert(light_box.bg_color.is_equal_approx(Brand.content_card_box(false, false, Brand.ROYAL_BLUE).bg_color),
|
||||
"toggling the app theme should rebuild flashcard note cards with the light surface (the library screen's theme_changed handler was previously a no-op)")
|
||||
var light_list_box := hub.list_card.get_theme_stylebox("panel") as StyleBoxFlat
|
||||
_assert(light_list_box.bg_color.is_equal_approx(Color.WHITE),
|
||||
"toggling the app theme should rebuild the flashcards list card with the light surface (the library screen's theme_changed handler was previously a no-op)")
|
||||
var light_row := hub.list_container.get_child(0) as BoxContainer
|
||||
var light_icon_box := (light_row.get_child(0) as PanelContainer).get_theme_stylebox("panel") as StyleBoxFlat
|
||||
_assert(light_icon_box.bg_color.is_equal_approx(Brand.icon_circle_box(false, Brand.ROYAL_BLUE, 20).bg_color),
|
||||
"a basic card's type icon should use its light accent styling")
|
||||
var light_menu_box := hub.export_menu.get_theme_stylebox("panel") as StyleBoxFlat
|
||||
_assert(light_menu_box.bg_color.is_equal_approx(Brand.panel_box(false).bg_color),
|
||||
"the export menu panel should also restyle to the light surface after a theme toggle")
|
||||
@@ -55,17 +61,16 @@ func _run() -> void:
|
||||
hub._update_responsive_layout()
|
||||
await process_frame
|
||||
_assert(hub.compact_layout, "the flashcards library should detect a phone-width viewport")
|
||||
var compact_card := hub.list_container.get_child(0) as PanelContainer
|
||||
var compact_row := compact_card.get_child(0) as BoxContainer
|
||||
var compact_row := hub.list_container.get_child(0) as BoxContainer
|
||||
_assert(compact_row.vertical, "phone-width flashcard rows should stack their content above the edit/archive actions instead of clipping")
|
||||
_assert(compact_card.get_combined_minimum_size().x <= hub.size.x,
|
||||
"a phone-width flashcard row should fit inside the viewport (minimum %.1f px)" % compact_card.get_combined_minimum_size().x)
|
||||
_assert(compact_row.get_combined_minimum_size().x <= hub.size.x,
|
||||
"a phone-width flashcard row should fit inside the viewport (minimum %.1f px)" % compact_row.get_combined_minimum_size().x)
|
||||
|
||||
hub.size = Vector2(1280, 800)
|
||||
hub._update_responsive_layout()
|
||||
await process_frame
|
||||
_assert(not hub.compact_layout, "a wide viewport should restore the flashcards library's desktop row layout")
|
||||
var wide_row := (hub.list_container.get_child(0) as PanelContainer).get_child(0) as BoxContainer
|
||||
var wide_row := hub.list_container.get_child(0) as BoxContainer
|
||||
_assert(not wide_row.vertical, "a wide viewport should lay flashcard row content out horizontally again")
|
||||
|
||||
hub.free()
|
||||
|
||||
Reference in New Issue
Block a user