mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-05 23:56:42 +08:00
Remove playing backdrop status badge
This commit is contained in:
@@ -33,9 +33,6 @@ const progressValue = computed(() => {
|
|||||||
// 是否存在可续播进度。
|
// 是否存在可续播进度。
|
||||||
const hasProgress = computed(() => progressValue.value > 0)
|
const hasProgress = computed(() => progressValue.value > 0)
|
||||||
|
|
||||||
// 顶部状态标签,接口返回的是继续观看列表而非实时播放会话。
|
|
||||||
const statusLabel = computed(() => (hasProgress.value ? '继续观看' : '待播放'))
|
|
||||||
|
|
||||||
// 右上角进度标签。
|
// 右上角进度标签。
|
||||||
const progressLabel = computed(() => (hasProgress.value ? `${Math.round(progressValue.value)}%` : 'NEW'))
|
const progressLabel = computed(() => (hasProgress.value ? `${Math.round(progressValue.value)}%` : 'NEW'))
|
||||||
|
|
||||||
@@ -124,11 +121,6 @@ async function goPlay() {
|
|||||||
<div class="playing-card__scrim" />
|
<div class="playing-card__scrim" />
|
||||||
<div class="playing-card__bottom-scrim" />
|
<div class="playing-card__bottom-scrim" />
|
||||||
|
|
||||||
<div class="playing-card__status">
|
|
||||||
<span class="playing-card__status-dot" />
|
|
||||||
<span class="playing-card__status-text">{{ statusLabel }}</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="playing-card__percent">
|
<div class="playing-card__percent">
|
||||||
{{ progressLabel }}
|
{{ progressLabel }}
|
||||||
</div>
|
</div>
|
||||||
@@ -228,7 +220,6 @@ async function goPlay() {
|
|||||||
linear-gradient(180deg, rgba(2, 6, 12, 0%) 24%, rgba(2, 6, 12, 72%) 68%, rgba(2, 6, 12, 96%) 100%);
|
linear-gradient(180deg, rgba(2, 6, 12, 0%) 24%, rgba(2, 6, 12, 72%) 68%, rgba(2, 6, 12, 96%) 100%);
|
||||||
}
|
}
|
||||||
|
|
||||||
.playing-card__status,
|
|
||||||
.playing-card__percent,
|
.playing-card__percent,
|
||||||
.playing-card__play,
|
.playing-card__play,
|
||||||
.playing-card__content,
|
.playing-card__content,
|
||||||
@@ -237,34 +228,6 @@ async function goPlay() {
|
|||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.playing-card__status {
|
|
||||||
display: inline-flex;
|
|
||||||
align-items: center;
|
|
||||||
border: 1px solid rgba(255, 255, 255, 22%);
|
|
||||||
border-radius: 999px;
|
|
||||||
backdrop-filter: blur(12px);
|
|
||||||
background: rgba(5, 10, 16, 72%);
|
|
||||||
block-size: 26px;
|
|
||||||
gap: 8px;
|
|
||||||
inset-block-start: 12px;
|
|
||||||
inset-inline-start: 12px;
|
|
||||||
padding: 0 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.playing-card__status-dot {
|
|
||||||
border-radius: 999px;
|
|
||||||
background: rgb(var(--v-theme-success));
|
|
||||||
block-size: 8px;
|
|
||||||
box-shadow: 0 0 0 4px rgba(var(--v-theme-success), 16%);
|
|
||||||
inline-size: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.playing-card__status-text {
|
|
||||||
font-size: 0.75rem;
|
|
||||||
font-weight: 700;
|
|
||||||
line-height: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.playing-card__percent {
|
.playing-card__percent {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|||||||
Reference in New Issue
Block a user