mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
Always show viewed tip (#4346)
This commit is contained in:
parent
7fc04a2d23
commit
b8121f7976
@ -60,16 +60,6 @@
|
||||
class="progress"
|
||||
:style="{ width: h.progress * 100 + '%' }"
|
||||
></div>
|
||||
<div v-if="h.progressText" class="floating progress-number">
|
||||
{{ h.progress >= 1 ? '已看完' : h.progressText }}
|
||||
</div>
|
||||
<div
|
||||
v-if="h.liveStatus !== undefined"
|
||||
class="floating duration live-status"
|
||||
:class="{ on: h.liveStatus === 1 }"
|
||||
>
|
||||
{{ h.liveStatus === 1 ? '直播中' : '未开播' }}
|
||||
</div>
|
||||
<div v-if="h.durationText" class="floating duration">{{ h.durationText }}</div>
|
||||
</a>
|
||||
<a class="title" target="_blank" :href="h.url" :title="h.title">{{
|
||||
@ -89,8 +79,25 @@
|
||||
></DpiImage>
|
||||
<div class="up-name">{{ h.upName }}</div>
|
||||
</a>
|
||||
<div v-if="h.timeText" class="time" :title="new Date(h.viewAt).toLocaleString()">
|
||||
{{ h.timeText }}
|
||||
<div class="history-info">
|
||||
<div v-if="h.progressText" class="progress-number">
|
||||
{{ h.progress >= 1 ? '已看完' : h.progressText }}
|
||||
</div>
|
||||
<div
|
||||
v-if="h.liveStatus !== undefined"
|
||||
class="duration live-status"
|
||||
:class="{ on: h.liveStatus === 1 }"
|
||||
>
|
||||
{{ h.liveStatus === 1 ? '直播中' : '未开播' }}
|
||||
</div>
|
||||
<span
|
||||
v-if="h.progressText || h.liveStatus !== undefined"
|
||||
class="history-info-separator"
|
||||
>|</span
|
||||
>
|
||||
<div v-if="h.timeText" class="time" :title="new Date(h.viewAt).toLocaleString()">
|
||||
{{ h.timeText }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</transition-group>
|
||||
@ -405,22 +412,6 @@ export default Vue.extend({
|
||||
filter: invert(0.9);
|
||||
}
|
||||
}
|
||||
.duration {
|
||||
left: $padding;
|
||||
bottom: $padding;
|
||||
padding: 0 6px;
|
||||
}
|
||||
.live-status {
|
||||
&.on {
|
||||
background-color: var(--theme-color);
|
||||
color: var(--foreground-color);
|
||||
}
|
||||
}
|
||||
.progress-number {
|
||||
left: $padding;
|
||||
top: $padding;
|
||||
padding: 0 6px;
|
||||
}
|
||||
.progress {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
@ -448,7 +439,7 @@ export default Vue.extend({
|
||||
}
|
||||
}
|
||||
.up,
|
||||
.time {
|
||||
.history-info {
|
||||
font-size: 11px;
|
||||
opacity: 0.75;
|
||||
align-self: center;
|
||||
@ -479,10 +470,23 @@ export default Vue.extend({
|
||||
}
|
||||
}
|
||||
}
|
||||
.time {
|
||||
.history-info {
|
||||
@include h-center(4px);
|
||||
font-size: 11px;
|
||||
grid-area: time;
|
||||
padding-right: 6px;
|
||||
&-separator {
|
||||
margin: 0 4px;
|
||||
}
|
||||
}
|
||||
.progress-number,
|
||||
.live-status {
|
||||
@include single-line();
|
||||
}
|
||||
.live-status {
|
||||
&.on {
|
||||
color: var(--theme-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -291,6 +291,11 @@ export default Vue.extend({
|
||||
border-radius: 8px 0 0 8px;
|
||||
position: relative;
|
||||
$padding: 6px;
|
||||
.floating {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
font-size: 11px;
|
||||
}
|
||||
.remove {
|
||||
top: $padding;
|
||||
left: $padding;
|
||||
@ -303,15 +308,11 @@ export default Vue.extend({
|
||||
}
|
||||
.viewed {
|
||||
white-space: nowrap;
|
||||
opacity: 1;
|
||||
right: $padding;
|
||||
top: $padding;
|
||||
bottom: $padding;
|
||||
padding: 0 6px;
|
||||
}
|
||||
.floating {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
font-size: 11px;
|
||||
}
|
||||
.cover {
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user