stats page layout tweaks

internal/embedfs/web/css/output.css

@@ -720,6 +720,9 @@
   .items-start {
     align-items: flex-start;
   }
+  .items-stretch {
+    align-items: stretch;
+  }
   .justify-between {
     justify-content: space-between;
   }
@@ -2316,6 +2319,11 @@
       display: flex;
     }
   }
+  .lg\:w-auto {
+    @media (width >= 64rem) {
+      width: auto;
+    }
+  }
   .lg\:grid-cols-2 {
     @media (width >= 64rem) {
       grid-template-columns: repeat(2, minmax(0, 1fr));

internal/view/seasonsview/season_league_stats.templ

@@ -38,9 +38,9 @@ templ SeasonLeagueStats(
 				<div class="space-y-4">
 					<h2 class="text-xl font-bold text-text text-center">Trophy Leaders</h2>
 				<!-- Triangle layout: two side-by-side on wide screens, saves centered below -->
-					<div class="flex flex-col items-center gap-6">
+				<div class="flex flex-col items-center gap-6 w-full">
 					<!-- Top row: Goals and Assists side by side when room allows -->
-						<div class="flex flex-col lg:flex-row gap-6 justify-center items-center lg:items-start">
+					<div class="flex flex-col lg:flex-row gap-6 justify-center items-stretch w-full lg:w-auto">
 						@topGoalScorersTable(season, league, topGoals)
 						@topAssistersTable(season, league, topAssists)
 					</div>
@@ -61,7 +61,7 @@ templ SeasonLeagueStats(
 }
 
 templ topGoalScorersTable(season *db.Season, league *db.League, goals []*db.LeagueTopGoalScorer) {
-	<div class="bg-surface0 border border-surface1 rounded-lg overflow-hidden">
+	<div class="bg-surface0 border border-surface1 rounded-lg overflow-hidden min-w-0 w-full lg:w-auto">
 		<div class="bg-mantle border-b border-surface1 px-4 py-3">
 			<h3 class="text-sm font-semibold text-text">
 				Top Goal Scorers
@@ -79,7 +79,8 @@ templ topGoalScorersTable(season *db.Season, league *db.League, goals []*db.Leag
 				<p class="text-subtext0 text-sm">No goal data available yet.</p>
 			</div>
 		} else {
-			<table>
+			<div class="overflow-x-auto">
+			<table class="w-full">
 				<thead class="bg-mantle border-b border-surface1">
 					<tr>
 						<th class="px-3 py-2 text-center text-xs font-semibold text-subtext0 w-10">#</th>
@@ -109,12 +110,13 @@ templ topGoalScorersTable(season *db.Season, league *db.League, goals []*db.Leag
 					}
 				</tbody>
 			</table>
+			</div>
 		}
 	</div>
 }
 
 templ topAssistersTable(season *db.Season, league *db.League, assists []*db.LeagueTopAssister) {
-	<div class="bg-surface0 border border-surface1 rounded-lg overflow-hidden">
+	<div class="bg-surface0 border border-surface1 rounded-lg overflow-hidden min-w-0 w-full lg:w-auto">
 		<div class="bg-mantle border-b border-surface1 px-4 py-3">
 			<h3 class="text-sm font-semibold text-text">
 				Top Assisters
@@ -132,7 +134,8 @@ templ topAssistersTable(season *db.Season, league *db.League, assists []*db.Leag
 				<p class="text-subtext0 text-sm">No assist data available yet.</p>
 			</div>
 		} else {
-			<table>
+			<div class="overflow-x-auto">
+			<table class="w-full">
 				<thead class="bg-mantle border-b border-surface1">
 					<tr>
 						<th class="px-3 py-2 text-center text-xs font-semibold text-subtext0 w-10">#</th>
@@ -162,12 +165,13 @@ templ topAssistersTable(season *db.Season, league *db.League, assists []*db.Leag
 					}
 				</tbody>
 			</table>
+			</div>
 		}
 	</div>
 }
 
 templ topSaversTable(season *db.Season, league *db.League, saves []*db.LeagueTopSaver) {
-	<div class="bg-surface0 border border-surface1 rounded-lg overflow-hidden">
+	<div class="bg-surface0 border border-surface1 rounded-lg overflow-hidden min-w-0 w-full lg:w-auto">
 		<div class="bg-mantle border-b border-surface1 px-4 py-3">
 			<h3 class="text-sm font-semibold text-text">
 				Top Saves
@@ -185,7 +189,8 @@ templ topSaversTable(season *db.Season, league *db.League, saves []*db.LeagueTop
 				<p class="text-subtext0 text-sm">No save data available yet.</p>
 			</div>
 		} else {
-			<table>
+			<div class="overflow-x-auto">
+			<table class="w-full">
 				<thead class="bg-mantle border-b border-surface1">
 					<tr>
 						<th class="px-3 py-2 text-center text-xs font-semibold text-subtext0 w-10">#</th>
@@ -215,6 +220,7 @@ templ topSaversTable(season *db.Season, league *db.League, saves []*db.LeagueTop
 					}
 				</tbody>
 			</table>
+			</div>
 		}
 	</div>
 }