feat: 收藏页网格末尾加'发现更多'CTA引导卡片

虚线边框+圆形+号图标+'发现更多'文案,点击返回列表视图。
与普通卡片同尺寸,作为收藏页的自然出口。

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
liulujian 2026-07-04 23:44:37 +08:00
parent 5bbb9d265f
commit 6967c8adb6

View File

@ -192,6 +192,16 @@
<GxnlptCardTags :tags="card.tagList" />
</div>
</article>
<!-- 引导卡片返回列表继续发现 -->
<article
class="gxnlpt-card gxnlpt-card--cta"
@click="contentView = 'list'"
>
<div class="gxnlpt-card-body gxnlpt-card-cta-body">
<span class="gxnlpt-card-cta-icon" aria-hidden="true">+</span>
<span class="gxnlpt-card-cta-text">发现更多</span>
</div>
</article>
</div>
</section>
@ -2560,8 +2570,50 @@ html.portal-figma-scale-active .gxnlpt-page {
}
.gxnlpt-card--expired:hover {
border-color: fade(#000, 10%);
box-shadow: none;
transform: none;
}
/* ── 收藏页 CTA 引导卡片 ── */
.gxnlpt-card--cta {
border: 1px dashed #c8d6cc;
box-shadow: none;
background: transparent;
cursor: pointer;
&:hover {
border-color: @home-color-primary-green;
background: fade(@home-color-primary-green, 3%);
box-shadow: none;
transform: translateY(-3px);
}
}
.gxnlpt-card-cta-body {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 10px;
height: 100%;
}
.gxnlpt-card-cta-icon {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
font-size: 26px;
font-weight: 300;
color: @home-color-primary-green;
background: fade(@home-color-primary-green, 8%);
border-radius: 50%;
}
.gxnlpt-card-cta-text {
font-size: 15px;
font-weight: 500;
color: @home-color-primary-green;
}
.gxnlpt-card-expired-tag {