style: 复习卡片悬浮时显示查看详情提示

This commit is contained in:
2026-09-13 22:16:00 +08:00
parent 5a382d95e4
commit d9a0b55da0
+14
View File
@@ -96,6 +96,7 @@ onMounted(() => {
</div> </div>
<!-- 卡片整体已可进详情这里只保留回忆复习作为明确的主操作 --> <!-- 卡片整体已可进详情这里只保留回忆复习作为明确的主操作 -->
<div class="task-actions"> <div class="task-actions">
<span class="detail-hint">查看详情 </span>
<el-button <el-button
class="recall-button" class="recall-button"
type="success" type="success"
@@ -178,6 +179,19 @@ onMounted(() => {
outline-offset: 2px; outline-offset: 2px;
} }
.detail-hint {
font-size: 12px;
color: var(--text-secondary);
opacity: 0;
transition: opacity 0.18s ease, color 0.18s ease;
}
.task-card:hover .detail-hint,
.task-card:focus-visible .detail-hint {
opacity: 1;
color: var(--green-600);
}
.task-head strong { .task-head strong {
display: block; display: block;
color: var(--green-900); color: var(--green-900);