/* 通用布局 */ .page-container.data-v-1cf27b2a { min-height: 100vh; background-color: #F9FAFB; /* 浅灰色背景,与添加按钮背景一致 */ } .flex-row.data-v-1cf27b2a { display: flex; flex-direction: row; } .flex-col.data-v-1cf27b2a { display: flex; flex-direction: column; } .items-center.data-v-1cf27b2a { align-items: center; } .gap-2.data-v-1cf27b2a { gap: 16rpx; } .mt-2.data-v-1cf27b2a { margin-top: 16rpx; } /* 字体颜色工具类 */ .text-white.data-v-1cf27b2a { color: #fff; } .text-gray-500.data-v-1cf27b2a { color: #6B7280; } .text-green-600.data-v-1cf27b2a { color: #059669; } .text-green-700.data-v-1cf27b2a { color: #047857; } .text-blue-700.data-v-1cf27b2a { color: #1D4ED8; } .text-red.data-v-1cf27b2a { color: #EF4444; } /* 涨 */ .text-green.data-v-1cf27b2a { color: #10B981; } /* 跌 */ /* ============================ */ /* Part 1: 资产卡片样式 (精修版) */ /* ============================ */ .header-section.data-v-1cf27b2a { padding: 20rpx 32rpx; background-color: #F9FAFB; /* 浅灰色背景,与页面背景一致 */ } .asset-card.data-v-1cf27b2a { background-color: #064E3B; /* 深墨绿色 */ border-radius: 40rpx; padding: 40rpx 48rpx; position: relative; overflow: hidden; box-shadow: 0 10rpx 30rpx rgba(6, 78, 59, 0.25); min-height: 320rpx; display: flex; flex-direction: column; justify-content: space-between; } /* 内容行通用设置 */ .card-row.data-v-1cf27b2a { position: relative; z-index: 1; } /* 第一行:顶部布局 (关键修复:两端对齐) */ .top-row.data-v-1cf27b2a { display: flex; justify-content: space-between; /* 让铃铛靠右 */ align-items: center; margin-bottom: 20rpx; } .row-left.data-v-1cf27b2a { display: flex; align-items: center; } .label-text.data-v-1cf27b2a { font-size: 26rpx; color: rgba(255, 255, 255, 0.7); font-weight: 400; } .eye-btn.data-v-1cf27b2a { margin-left: 12rpx; opacity: 0.8; } /* 第二行:大数字 */ .main-row.data-v-1cf27b2a { display: flex; align-items: baseline; margin-bottom: 30rpx; } .currency-symbol.data-v-1cf27b2a { font-size: 40rpx; color: #FFFFFF; font-weight: bold; margin-right: 8rpx; font-family: 'DIN Alternate', sans-serif; } .big-number.data-v-1cf27b2a { font-size: 68rpx; color: #FFFFFF; font-weight: 800; letter-spacing: 1rpx; font-family: 'DIN Alternate', sans-serif; } /* 第三行:底部数据 */ .bottom-row.data-v-1cf27b2a { display: flex; justify-content: space-between; align-items: flex-end; } .stat-col.data-v-1cf27b2a { display: flex; flex-direction: column; gap: 8rpx; } .align-right.data-v-1cf27b2a { align-items: flex-end; } .stat-label.data-v-1cf27b2a { font-size: 24rpx; color: rgba(255, 255, 255, 0.6); } .stat-value.data-v-1cf27b2a { font-size: 36rpx; color: #FFFFFF; font-weight: 700; font-family: 'DIN Alternate', sans-serif; } /* ============================ */ /* Part 2: 添加组合按钮样式 */ /* ============================ */ .part-add-portfolio.data-v-1cf27b2a { padding: 10rpx 32rpx 30rpx 32rpx; } .dashed-btn.data-v-1cf27b2a { width: 100%; height: 96rpx; background-color: #F9FAFB; border: 2rpx dashed #D1D5DB; border-radius: 24rpx; display: flex; align-items: center; justify-content: center; gap: 12rpx; transition: all 0.2s; } .dashed-btn.data-v-1cf27b2a:active { background-color: #F3F4F6; border-color: #9CA3AF; } .btn-text.data-v-1cf27b2a { font-size: 28rpx; color: #6B7280; font-weight: 500; } /* ============================ */ /* Part 3: 持仓列表样式 */ /* ============================ */ .part-holdings-list.data-v-1cf27b2a { padding: 0 32rpx; } .section-header.data-v-1cf27b2a { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24rpx; padding-left: 8rpx; } .section-title.data-v-1cf27b2a { font-size: 32rpx; font-weight: 800; color: #1F2937; } .view-all.data-v-1cf27b2a { font-size: 24rpx; color: #064E3B; font-weight: 600; margin-right: 4rpx; } /* 卡片样式 */ .holding-card.data-v-1cf27b2a { background-color: #FFFFFF; border: 1rpx solid #E5E7EB; border-radius: 32rpx; padding: 32rpx; margin-bottom: 24rpx; box-shadow: 0 12rpx 32rpx rgba(0, 0, 0, 0.06); transition: all 0.2s ease; } .holding-card.data-v-1cf27b2a:active { transform: translateY(2rpx); box-shadow: 0 6rpx 16rpx rgba(0, 0, 0, 0.04); } .card-top.data-v-1cf27b2a { display: flex; justify-content: space-between; align-items: flex-start; } .strategy-icon.data-v-1cf27b2a { width: 80rpx; height: 80rpx; border-radius: 20rpx; display: flex; align-items: center; justify-content: center; } .bg-green-100.data-v-1cf27b2a { background-color: #D1FAE5; } .bg-blue-100.data-v-1cf27b2a { background-color: #DBEAFE; } .bg-green-50.data-v-1cf27b2a { background-color: #ECFDF5; } .bg-gray-100.data-v-1cf27b2a { background-color: #F3F4F6; } .icon-text.data-v-1cf27b2a { font-size: 36rpx; font-weight: 800; } .card-name.data-v-1cf27b2a { font-size: 30rpx; font-weight: 700; color: #1F2937; margin-bottom: 6rpx; } .card-tags.data-v-1cf27b2a { font-size: 22rpx; color: #9CA3AF; } .status-badge.data-v-1cf27b2a { padding: 6rpx 16rpx; border-radius: 100rpx; } .status-text.data-v-1cf27b2a { font-size: 20rpx; font-weight: 600; } .card-divider.data-v-1cf27b2a { height: 1rpx; background-color: #F3F4F6; margin: 24rpx 0; } .card-bottom.data-v-1cf27b2a { display: flex; justify-content: space-between; } .data-col.data-v-1cf27b2a { display: flex; flex-direction: column; } .data-label.data-v-1cf27b2a { font-size: 22rpx; color: #9CA3AF; margin-bottom: 8rpx; } .data-val.data-v-1cf27b2a { font-size: 32rpx; font-weight: 700; font-family: 'DIN Alternate', sans-serif; color: #1F2937; }