feat: 调整了组件的样式

This commit is contained in:
2026-07-14 11:15:49 +08:00
parent 515e02f3af
commit 284becd6a8
7 changed files with 19 additions and 16 deletions

View File

@@ -5,7 +5,7 @@
.swiper-stage { .swiper-stage {
position: relative; position: relative;
width: 100%; width: 100%;
height: 270px; height: 265px;
overflow: hidden; overflow: hidden;
} }
@@ -33,7 +33,7 @@
overflow: hidden; overflow: hidden;
border-radius: 24px; border-radius: 24px;
background: #ffffff; background: #ffffff;
box-shadow: 0 12px 20px rgba(15, 23, 42, 0.14); box-shadow: 0 12px 16px rgba(15, 23, 42, 0.14);
} }
.card-media { .card-media {
@@ -93,7 +93,7 @@
} }
.is-current .card-shell { .is-current .card-shell {
box-shadow: 0 12px 20px rgba(15, 23, 42, 0.18); box-shadow: 0 12px 16px rgba(15, 23, 42, 0.18);
} }
.is-single .swiper-stage { .is-single .swiper-stage {

View File

@@ -1,9 +1,9 @@
.discovery-audio-tool-card { .discovery-audio-tool-card {
width: 100%; width: 100%;
height: 96px;
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
box-sizing: border-box; box-sizing: border-box;
padding: 0 12px;
} }
.discovery-audio-tool-card.is-pressed { .discovery-audio-tool-card.is-pressed {
@@ -28,7 +28,7 @@
height: 88px; height: 88px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 18px 12px 14px; padding: 12px;
border-radius: 28px; border-radius: 28px;
background: #ffffff; background: #ffffff;
box-sizing: border-box; box-sizing: border-box;
@@ -94,7 +94,6 @@
.audio-progress-row { .audio-progress-row {
display: flex; display: flex;
align-items: center; align-items: center;
margin-top: 16px;
} }
.audio-progress-track { .audio-progress-track {
@@ -114,9 +113,9 @@
.audio-time { .audio-time {
flex: 0 0 90px; flex: 0 0 90px;
max-width: 90px; max-width: 90px;
margin-left: 12px; margin-left: 10px;
color: #94a0b2; color: #94a0b2;
font-size: 15px; font-size: 12px;
line-height: 20px; line-height: 20px;
font-weight: 600; font-weight: 600;
text-align: right; text-align: right;

View File

@@ -4,6 +4,7 @@
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
box-sizing: border-box; box-sizing: border-box;
padding: 0 12px;
} }
.discovery-guide-map-tool-card.is-pressed { .discovery-guide-map-tool-card.is-pressed {

View File

@@ -4,6 +4,7 @@
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
box-sizing: border-box; box-sizing: border-box;
padding: 0 12px;
} }
.discovery-photo-tool-card.is-pressed { .discovery-photo-tool-card.is-pressed {
@@ -28,7 +29,7 @@
height: 142px; height: 142px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 16px 12px 12px; padding: 12px;
border-radius: 28px; border-radius: 28px;
background: #ffffff; background: #ffffff;
box-sizing: border-box; box-sizing: border-box;
@@ -197,7 +198,7 @@
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
gap: 8px; gap: 8px;
margin-top: 10px; margin-top: 6px;
} }
.photo-option { .photo-option {
@@ -250,7 +251,7 @@
.photo-option-label { .photo-option-label {
display: block; display: block;
max-width: 76px; max-width: 76px;
margin: 5px auto 0; margin: 2px auto 0;
color: $theme-color-500; color: $theme-color-500;
font-size: 14px; font-size: 14px;
line-height: 18px; line-height: 18px;

View File

@@ -2,7 +2,6 @@
width: 100%; width: 100%;
height: 356px; height: 356px;
overflow: hidden; overflow: hidden;
padding-bottom: 12px;
} }
.explore-scroll { .explore-scroll {

View File

@@ -1,5 +1,5 @@
.container-scroll { .container-scroll {
margin: 4px 0 6px;
} }
.card-item { .card-item {

View File

@@ -12,9 +12,9 @@
<QuickQuestions v-if="discoveryQuickQuestions.length > 0" :list="discoveryQuickQuestions" <QuickQuestions v-if="discoveryQuickQuestions.length > 0" :list="discoveryQuickQuestions"
@didSelectItem="handleQuickQuestionClick" /> @didSelectItem="handleQuickQuestionClick" />
<!-- <DiscoveryPhotoToolCard @didSelectItem="handleToolCardClick" @didSelectOption="handleToolOptionClick" /> <DiscoveryPhotoToolCard @didSelectItem="handleToolCardClick" @didSelectOption="handleToolOptionClick" />
<DiscoveryAudioToolCard @didSelectItem="handleToolCardClick" /> <DiscoveryAudioToolCard @didSelectItem="handleToolCardClick" />
<DiscoveryGuideMapToolCard @didSelectItem="handleToolCardClick" /> --> <DiscoveryGuideMapToolCard @didSelectItem="handleToolCardClick" />
</view> </view>
</scroll-view> </scroll-view>
</view> </view>
@@ -260,5 +260,8 @@ onMounted(() => {
.discovery-body { .discovery-body {
width: 100%; width: 100%;
gap: 12px;
display: flex;
flex-direction: column;
} }
</style> </style>