mirror of
https://github.com/we-promise/sure.git
synced 2026-04-19 12:04:08 +00:00
Refactor report and dashboard table layouts to semantic HTML (#1222)
* Refactor report and dashboard tables from div grids to semantic HTML Convert div-based grid layouts to proper <table>/<thead>/<tbody>/<tr>/<th>/<td> elements in report views and the dashboard investment summary: - reports/_breakdown_table + _category_row (income/expense breakdown) - reports/_trends_insights (monthly trends) - reports/_net_worth (asset/liability summaries) - reports/_investment_performance (top holdings) - pages/dashboard/_investment_summary (top holdings) Replaces shared/ruler dividers with border-b border-divider on <tr> elements. Updates test selectors from div[data-category] to tr[data-category] and from [role="columnheader"] to thead/th. Closes #1121 * Address PR review feedback - Restore w-max sm:w-full wrapper on report tables to preserve horizontal scroll behavior on narrow screens - Add sr-only accessible header for net worth amount columns - Use border-divider instead of border-primary in dashboard investment summary * Fix rounded corners on semantic table body containers Move rounded-lg, shadow-border-xs, and bg-container from tbody (where border-radius and box-shadow don't apply) to a wrapper div with overflow-hidden. Add bg-container-inset on thead to preserve the two-tone card design.
This commit is contained in:
@@ -82,8 +82,8 @@ class ReportsControllerTest < ActionDispatch::IntegrationTest
|
||||
get reports_path(period_type: :monthly)
|
||||
assert_response :ok
|
||||
assert_select "h2", text: I18n.t("reports.trends.title")
|
||||
assert_select '[role="columnheader"]' do
|
||||
assert_select "div", text: I18n.t("reports.trends.month")
|
||||
assert_select "thead" do
|
||||
assert_select "th", text: I18n.t("reports.trends.month")
|
||||
end
|
||||
end
|
||||
|
||||
@@ -239,10 +239,10 @@ class ReportsControllerTest < ActionDispatch::IntegrationTest
|
||||
assert_response :ok
|
||||
|
||||
# Parent category
|
||||
assert_select "div[data-category='category-#{parent_category.id}']", text: /^Entertainment/
|
||||
assert_select "tr[data-category='category-#{parent_category.id}']", text: /^Entertainment/
|
||||
|
||||
# Subcategories
|
||||
assert_select "div[data-category='category-#{subcategory_movies.id}']", text: /^Movies/
|
||||
assert_select "div[data-category='category-#{subcategory_games.id}']", text: /^Games/
|
||||
assert_select "tr[data-category='category-#{subcategory_movies.id}']", text: /^Movies/
|
||||
assert_select "tr[data-category='category-#{subcategory_games.id}']", text: /^Games/
|
||||
end
|
||||
end
|
||||
|
||||
Reference in New Issue
Block a user