From 11b08def88199102c94b9f01190edb1a1fe84114 Mon Sep 17 00:00:00 2001 From: hajimi Date: Sun, 2 Aug 2026 11:18:43 +0800 Subject: [PATCH] style: split crypto market columns evenly --- uniapp/src/pages/crypto/crypto.vue | 24 ++++++++++++++---------- 1 file changed, 14 insertions(+), 10 deletions(-) diff --git a/uniapp/src/pages/crypto/crypto.vue b/uniapp/src/pages/crypto/crypto.vue index 59d3e03..d791443 100644 --- a/uniapp/src/pages/crypto/crypto.vue +++ b/uniapp/src/pages/crypto/crypto.vue @@ -565,29 +565,30 @@ $down: #ef2f3d; .list-header { height: 62rpx; padding: 0 26rpx 0 34rpx; - display: flex; align-items: center; color: #737d8b; font-size: 24rpx; border-bottom: 1rpx solid $line; + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)) 54rpx; &__name { - flex: 1; + min-width: 0; } &__price { - width: 210rpx; + width: auto; text-align: right; } &__change { - width: 156rpx; - margin-left: 32rpx; + width: auto; + margin-left: 0; text-align: center; } &__favorite { - width: 54rpx; + width: auto; } } @@ -600,8 +601,9 @@ $down: #ef2f3d; .coin-row { height: 112rpx; padding: 0 26rpx 0 34rpx; - display: flex; align-items: center; + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)) 54rpx; border-bottom: 1rpx solid $line; box-sizing: border-box; @@ -660,7 +662,8 @@ $down: #ef2f3d; } &__price { - width: 210rpx; + width: auto; + min-width: 0; display: flex; flex-direction: column; align-items: flex-end; @@ -668,7 +671,7 @@ $down: #ef2f3d; } &__price-value { - max-width: 210rpx; + max-width: 100%; color: #111318; font-size: 27rpx; line-height: 1.1; @@ -686,8 +689,9 @@ $down: #ef2f3d; &__badge { width: 156rpx; + max-width: 100%; height: 54rpx; - margin-left: 32rpx; + justify-self: center; border-radius: 14rpx; display: flex; align-items: center;