Stabilize hero stat layout

2026-05-06 19:48:09 +01:00
parent 1f86bf9cff
commit b2f81a1f8d
1 changed files with 19 additions and 1 deletions
--- a/apps/web/src/components/PoolHero.vue
+++ b/apps/web/src/components/PoolHero.vue
@@ -99,11 +99,29 @@ const ageS = computed(() => {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 12px;
+  align-items: stretch;
+}
+.cell {
+  min-height: 74px;
+  display: grid;
+  grid-template-rows: 34px 1fr;
+  align-content: start;
+}
+.cell .label {
+  min-height: 34px;
+  display: flex;
+  align-items: flex-start;
+  line-height: 1.25;
+  overflow: hidden;
 }
 .cell .value {
  font-size: 18px;
  font-weight: 600;
-  margin-top: 4px;
+  margin-top: 6px;
+  min-height: 28px;
+  display: flex;
+  align-items: baseline;
+  white-space: nowrap;
 }
@media (max-width: 800px) {
  .hero { grid-template-columns: 1fr; }