fix(chart): stop "View raw data" link overlapping the mobile chart canvas
Build and Push Docker Images / Build Backend (FastAPI) (push) Successful in 14s
Build and Push Docker Images / Build Frontend (Next.js) (push) Successful in 51s
Build and Push Docker Images / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 12s
Build and Push Docker Images / Trigger Portainer Update (push) Successful in 1s
Build and Push Docker Images / Build Backend (FastAPI) (push) Successful in 14s
Build and Push Docker Images / Build Frontend (Next.js) (push) Successful in 51s
Build and Push Docker Images / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 12s
Build and Push Docker Images / Trigger Portainer Update (push) Successful in 1s
The previous commit added the chip strip and subtitle inside the .chartOuter, but .chartContainer on the parent SchoolDetailView still had a fixed height: 220px. With the new content stacking above the canvas the chart + COVID footnote overflowed past 220px, and the <details> "View raw year-by-year data" disclosure (rendered just after the container) landed on top of the plot. It also pushed the COVID footnote out of the card onto the page background. - .chartContainer at ≤640px now flows naturally (height: auto) - .chartWrapper at ≤640px gets an explicit 220px height so the canvas itself still has a known size for Chart.js to render into. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -118,6 +118,12 @@
|
||||
.mobileChips {
|
||||
display: block;
|
||||
}
|
||||
/* Canvas needs an explicit height now that the parent .chartContainer
|
||||
flows naturally (its old fixed 220px was clipping the chip strip and
|
||||
pushing the disclosure link onto the plot area). */
|
||||
.chartWrapper {
|
||||
height: 220px;
|
||||
}
|
||||
/* The desktop "click the legend to show progress" hint is irrelevant
|
||||
once the chip row is the disclosure mechanism. */
|
||||
.chartHint {
|
||||
|
||||
Reference in New Issue
Block a user