ciphera-net/pulse
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 15 Wiki Activity

fix: prevent grid children from overflowing on mobile

Browse Source 
Add [&>*]:min-w-0 to lg:grid-cols-2 grids so widget cards
respect the grid track width instead of expanding to content size.
This commit is contained in:
Usman Baig
2026-03-15 18:20:08 +01:00
parent 24c71f7991
commit 6d6c1ee8f6
2 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/sites/[id]/behavior/page.tsx
View File

@@ -123,7 +123,7 @@ export default function BehaviorPage() {
<FrustrationSummaryCards data={summary} loading={loading} />
{/* Rage clicks + Dead clicks side by side */}
<div className="grid gap-6 lg:grid-cols-2 mb-8">
<div className="grid gap-6 lg:grid-cols-2 mb-8 [&>*]:min-w-0">
<FrustrationTable
title="Rage Clicks"
description="Elements users clicked repeatedly in frustration"
@@ -150,7 +150,7 @@ export default function BehaviorPage() {
{/* Scroll depth + Frustration trend — hide when data failed to load */}
{!behaviorError && (
<div className="grid gap-6 lg:grid-cols-2 mb-8">
<div className="grid gap-6 lg:grid-cols-2 mb-8 [&>*]:min-w-0">
<ScrollDepth
goalCounts={dashboard?.goal_counts ?? []}
totalPageviews={dashboard?.stats?.pageviews ?? 0}

8
app/sites/[id]/page.tsx
View File

@@ -554,7 +554,7 @@ export default function SiteDashboardPage() {
/>
</div>
<div className="grid gap-6 lg:grid-cols-2 mb-8">
<div className="grid gap-6 lg:grid-cols-2 mb-8 [&>*]:min-w-0">
<ContentStats
topPages={dashboard?.top_pages ?? []}
entryPages={dashboard?.entry_pages ?? []}
@@ -574,7 +574,7 @@ export default function SiteDashboardPage() {
/>
</div>
<div className="grid gap-6 lg:grid-cols-2 mb-8">
<div className="grid gap-6 lg:grid-cols-2 mb-8 [&>*]:min-w-0">
<Locations
countries={dashboard?.countries ?? []}
cities={dashboard?.cities ?? []}
@@ -597,11 +597,11 @@ export default function SiteDashboardPage() {
/>
</div>
<div className="grid gap-6 lg:grid-cols-2 mb-8">
<div className="grid gap-6 lg:grid-cols-2 mb-8 [&>*]:min-w-0">
<Campaigns siteId={siteId} dateRange={dateRange} filters={filtersParam || undefined} onFilter={handleAddFilter} />
<PeakHours siteId={siteId} dateRange={dateRange} />
</div>
<div className="grid gap-6 lg:grid-cols-2 mb-8">
<div className="grid gap-6 lg:grid-cols-2 mb-8 [&>*]:min-w-0">
<SearchPerformance siteId={siteId} dateRange={dateRange} />
<GoalStats
goalCounts={(dashboard?.goal_counts ?? []).filter(g => !/^scroll_\d+$/.test(g.event_name))}