Toyas/HAOVP
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor(frontend): Rework home and video detail interactions

Browse Source
This commit is contained in:
Toyas
2026-04-24 17:35:13 +08:00
parent 833dd3451a
commit 59af57c0fa
38 changed files with 2693 additions and 986 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/video-frontend-web/src/styles/index.scss
+81 -3
View File
@@ -219,7 +219,7 @@ select {
--van-dialog-cancel-button-text-color: #61666d;
--van-toast-radius: 18px;
--van-toast-default-width: auto;
--van-toast-background: rgba(24, 25, 28, 0.88);
--van-toast-background: rgba(24, 25, 28, 0.92);
--van-toast-text-color: #fff;
--van-notify-radius: 0 0 18px 18px;
}
@@ -279,10 +279,88 @@ select {
}
.van-toast {
padding: 12px 16px;
box-shadow: 0 16px 36px rgba(15, 23, 42, 0.18);
min-width: 144px;
max-width: min(320px, calc(100vw - 32px));
padding: 14px 18px;
border-radius: 20px !important;
border: 1px solid rgba(255, 255, 255, 0.14);
backdrop-filter: blur(14px);
box-shadow: 0 18px 42px rgba(15, 23, 42, 0.22);
font-size: 14px;
line-height: 1.5;
text-align: center;
transform: translateY(0);
animation: toast-pop-in 0.22s cubic-bezier(0.22, 1, 0.36, 1);
will-change: transform, opacity;
.van-toast__text {
font-weight: 600;
letter-spacing: 0.01em;
}
.van-toast__icon {
margin-bottom: 10px;
font-size: 24px;
}
}
.van-toast--text {
background:
linear-gradient(180deg, rgba(35, 39, 47, 0.96), rgba(24, 25, 28, 0.92)),
rgba(24, 25, 28, 0.92);
}
.van-toast--success {
background:
linear-gradient(135deg, rgba(240, 253, 244, 0.96), rgba(220, 252, 231, 0.94)),
#f0fdf4;
border-color: rgba(34, 197, 94, 0.18);
color: #166534 !important;
box-shadow: 0 18px 42px rgba(34, 197, 94, 0.18);
.van-toast__icon {
color: #22c55e;
}
}
.van-toast--fail {
background:
linear-gradient(135deg, rgba(254, 242, 242, 0.96), rgba(255, 228, 230, 0.94)),
#fff1f2;
border-color: rgba(244, 63, 94, 0.16);
color: #be123c !important;
box-shadow: 0 18px 42px rgba(244, 63, 94, 0.16);
.van-toast__icon {
color: #f43f5e;
}
}
.van-toast--loading {
background:
linear-gradient(135deg, rgba(239, 246, 255, 0.96), rgba(224, 242, 254, 0.94)),
#eff6ff;
border-color: rgba(14, 165, 233, 0.18);
color: #0f766e !important;
box-shadow: 0 18px 42px rgba(14, 165, 233, 0.16);
}
@keyframes toast-pop-in {
0% {
opacity: 0;
transform: translateY(8px) scale(0.96);
}
100% {
opacity: 1;
transform: translateY(0) scale(1);
}
}
@media (prefers-reduced-motion: reduce) {
.van-toast {
animation: none;
}
}
.van-notify {