Files
past-go/weapp/pages/pet/pet.wxss
T
2026-10-07 09:28:43 +08:00

20 lines
6.7 KiB
Plaintext

@import '../../styles/common.wxss';
@import '../../styles/design.wxss';
@import '../../styles/journal.wxss';
@import '../../styles/companion.wxss';
.pet-profile { background:#FFFDF8; border:1rpx solid #E9DDD0; border-radius:12rpx 36rpx 12rpx 12rpx; padding:28rpx; }
.pet-profile-heading { display:flex; align-items:center; justify-content:space-between; gap:16rpx; }.pet-profile-heading .j-eyebrow { font-size:17rpx; letter-spacing:1rpx; }
.pet-profile-actions { display:flex; align-items:center; gap:18rpx; }.pet-profile-actions > view { font-size:22rpx; color:#B74768; min-height:52rpx; display:flex; align-items:center; }
.pet-profile-main { display:flex; align-items:center; gap:26rpx; margin:22rpx 0 30rpx; }.pet-avatar-wrap { position:relative; flex-shrink:0; }.pet-avatar-ring { width:134rpx; height:134rpx; background:#F1EBE2; border:1rpx solid #E9DDD0; border-radius:50%; display:flex; align-items:center; justify-content:center; }.pet-avatar { font-size:76rpx; }.pet-equip { position:absolute; right:-6rpx; top:0; font-size:28rpx; }
.pet-profile-info { flex:1; min-width:0; }.pet-name-row { display:flex; align-items:center; gap:12rpx; }.pet-name { font-size:36rpx; line-height:1.4; font-weight:600; color:#352E2A; overflow-wrap:break-word; }.pet-gender-text { font-size:24rpx; color:#85776D; }.pet-description { display:block; font-size:24rpx; color:#65594F; margin-top:10rpx; }.pet-adopt-days { display:block; font-size:23rpx; color:#85776D; margin-top:12rpx; }
.pet-level-bar { display:flex; align-items:center; gap:16rpx; }.level-label { font-size:22rpx; color:#943C58; flex-shrink:0; }.exp-track { height:10rpx; flex:1; background:#EDE3D7; border-radius:10rpx; overflow:hidden; }.exp-fill { height:100%; background:#B78F68; border-radius:10rpx; }.exp-text { font-size:20rpx; color:#85776D; flex-shrink:0; }
.stats-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16rpx; margin-top:20rpx; padding:0!important; border:0!important; background:transparent!important; box-shadow:none!important; }
.stat-card { background:#FFFDF8; border:1rpx solid #E9DDD0; border-radius:14rpx; padding:20rpx; }.stat-head { display:flex; align-items:center; gap:10rpx; margin-bottom:16rpx; }.stat-icon { font-size:27rpx; }.stat-label { flex:1; font-size:23rpx; color:#85776D; }.stat-value { font-size:28rpx; font-weight:500; color:#352E2A; }.stat-bar { height:7rpx; background:#EDE3D7; border-radius:8rpx; overflow:hidden; }.stat-fill { height:100%; border-radius:8rpx; }.stat-happiness .stat-fill { background:#C6A06F; }.stat-hunger .stat-fill { background:#CA8E9E; }.stat-energy .stat-fill { background:#91A487; }.stat-cleanliness .stat-fill { background:#87A3B0; }
.section-title { display:flex; align-items:center; justify-content:space-between; gap:16rpx; margin:34rpx 0 20rpx; font-size:29rpx; font-weight:600; color:#352E2A; }.section-subtitle { font-size:22rpx; font-weight:400; color:#85776D; padding:10rpx 0; }
.daily-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16rpx; }.daily-item { display:flex; flex-direction:column; align-items:center; gap:12rpx; padding:22rpx 8rpx; background:#FFFDF8; border:1rpx solid #E9DDD0; border-radius:14rpx; }.daily-item.done { background:#F0F3EB; border-color:#C7D0BA; }.daily-icon-wrap { position:relative; }.daily-icon { font-size:34rpx; }.daily-check { position:absolute; right:-16rpx; top:-4rpx; width:24rpx; height:24rpx; border:1rpx solid #CBBDAE; background:#FFFDF8; border-radius:50%; }.daily-check.checked { display:flex; align-items:center; justify-content:center; color:#FFFDF8; border-color:#8B9D7E; background:#8B9D7E; font-size:18rpx; }.daily-label { color:#352E2A; font-size:25rpx; }.daily-partner { font-size:18rpx; color:#A39386; }.daily-partner.partner-done { color:#677B59; }.all-done-banner { margin-top:20rpx; border-radius:14rpx; background:#F0F3EB; padding:22rpx; text-align:center; font-size:24rpx; color:#677B59; }
.achievement-strip { display:flex; gap:14rpx; overflow-x:auto; padding-bottom:8rpx; }.ach-badge { display:flex; flex-direction:column; align-items:center; gap:12rpx; min-width:116rpx; padding:18rpx 12rpx; background:#FFFDF8; border:1rpx solid #E9DDD0; border-radius:14rpx; flex-shrink:0; }.ach-icon { font-size:34rpx; }.ach-name { color:#65594F; font-size:20rpx; }.ach-empty { width:100%; text-align:center; font-size:23rpx; color:#85776D; padding:30rpx 0; }
.dynamics-list { border-top:1rpx solid #E9DDD0; }.dynamic-item { display:flex; align-items:flex-start; gap:16rpx; padding:24rpx 0; border-bottom:1rpx solid #E9DDD0; }.dynamic-avatar { width:50rpx; height:50rpx; border-radius:50%; background:#F4E2E3; color:#943C58; display:flex; align-items:center; justify-content:center; font-size:23rpx; flex-shrink:0; overflow:hidden; }.dynamic-avatar-img { width:100%; height:100%; }.dynamic-content { flex:1; min-width:0; }.dynamic-text { display:block; font-size:25rpx; color:#65594F; line-height:1.6; }.dynamic-time { display:block; font-size:21rpx; color:#A39386; margin-top:8rpx; }
.adopt-hero { text-align:center; margin:12rpx 0 28rpx; }.adopt-hero-emoji { font-size:64rpx; }.adopt-card { background:#FFFDF8; border:1rpx solid #E9DDD0; border-radius:16rpx; padding:28rpx; }.adopt-title { display:block; font-size:31rpx; font-weight:600; color:#352E2A; text-align:center; }.adopt-desc { display:block; font-size:24rpx; line-height:1.6; color:#85776D; margin-top:14rpx; text-align:center; }
.breed-select { display:grid; grid-template-columns:repeat(4,1fr); gap:12rpx; margin-top:28rpx; }.breed-option { display:flex; flex-direction:column; align-items:center; gap:10rpx; padding:18rpx 4rpx; border:1rpx solid #E9DDD0; border-radius:12rpx; }.breed-option.active { background:#F4E2E3; border-color:#D5A6AE; }.breed-emoji { font-size:35rpx; }.breed-name { font-size:22rpx; color:#65594F; }.gender-select { display:flex; gap:16rpx; margin:24rpx 0; }.gender-option { display:flex; flex:1; justify-content:center; padding:20rpx 8rpx; border:1rpx solid #E9DDD0; border-radius:12rpx; color:#85776D; font-size:25rpx; }.gender-option.active { background:#F4E2E3; border-color:#D5A6AE; color:#943C58; }.adopt-btn { width:100%; font-size:26rpx; border-radius:18rpx; padding:24rpx 12rpx; }
.modal-overlay { z-index:1200; }.rename-modal { width:100%; max-width:600rpx; padding:36rpx; background:#FFFDF8; border:1rpx solid #E9DDD0; border-radius:24rpx; box-sizing:border-box; }.rename-modal-title { display:block; color:#352E2A; font-weight:600; font-size:31rpx; margin-bottom:26rpx; }.rename-input { width:100%; height:84rpx; padding:0 20rpx; background:#FAF5EE; border:1rpx solid #E9DDD0; border-radius:14rpx; box-sizing:border-box; font-size:27rpx; }.rename-actions { display:flex; gap:20rpx; margin-top:28rpx; }.rename-btn { flex:1; min-width:0; padding:24rpx 10rpx; font-size:26rpx; }.rename-placeholder { color:#A39386; }