Add star-player matches tab and watchlist-driven fetch.
Ship top-level #/matches with pro watchlist defaults, bump site to 0.5.71, and document the flow in AGENTS/README. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
voson
Cursor
+145
-4
@@ -700,7 +700,7 @@ body {
|
||||
}
|
||||
.matchup-row {
|
||||
display: grid;
|
||||
grid-template-columns: 64px 1fr auto auto;
|
||||
grid-template-columns: 64px 1fr auto;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
@@ -726,24 +726,73 @@ body {
|
||||
border-radius: 3px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.matchup-mid {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
min-width: 0;
|
||||
}
|
||||
.matchup-name {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 14px;
|
||||
}
|
||||
.matchup-meta {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 11px;
|
||||
}
|
||||
.matchup-score {
|
||||
font-variant-numeric: tabular-nums;
|
||||
font-size: 14px;
|
||||
color: #7eb6ff;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.matchup-score.is-agree {
|
||||
color: #7ecf9a;
|
||||
}
|
||||
.matchup-score.is-conflict {
|
||||
color: #e0a06a;
|
||||
}
|
||||
.matchup-games {
|
||||
font-size: 12px;
|
||||
min-width: 2.75rem;
|
||||
text-align: right;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.matchup-scope-hint,
|
||||
.matchup-freshness,
|
||||
.matchup-notes {
|
||||
font-size: 12px;
|
||||
line-height: 1.45;
|
||||
}
|
||||
.matchup-notes {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
margin-top: 10px;
|
||||
padding-top: 8px;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.08);
|
||||
text-align: center;
|
||||
}
|
||||
.matchup-note-line,
|
||||
.matchup-note-time {
|
||||
margin: 0;
|
||||
}
|
||||
.matchup-note-line {
|
||||
white-space: nowrap;
|
||||
}
|
||||
.matchup-note-time {
|
||||
margin-top: 2px;
|
||||
opacity: 0.85;
|
||||
}
|
||||
.matchup-note-line.is-stale,
|
||||
.matchup-freshness.is-stale {
|
||||
color: #e0a06a;
|
||||
}
|
||||
.meta-hero {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -1716,6 +1765,36 @@ body {
|
||||
.match-card.is-loss .match-result {
|
||||
color: rgba(230, 130, 130, 0.95);
|
||||
}
|
||||
.match-hero {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
font: inherit;
|
||||
max-width: 9.5em;
|
||||
}
|
||||
.match-hero:hover .match-hero-name {
|
||||
color: rgba(255, 220, 160, 0.95);
|
||||
}
|
||||
.match-hero-icon {
|
||||
width: 36px;
|
||||
height: 20px;
|
||||
object-fit: cover;
|
||||
border-radius: 3px;
|
||||
flex: 0 0 auto;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
.match-hero-name {
|
||||
font-size: 14px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.match-kda {
|
||||
font-variant-numeric: tabular-nums;
|
||||
letter-spacing: 0.02em;
|
||||
@@ -2522,6 +2601,24 @@ body:has(#items-view:not(.hidden)) {
|
||||
outline: 2px solid var(--sel);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
.matches-board .matches-body {
|
||||
min-height: 0;
|
||||
}
|
||||
.matches-center-wrap {
|
||||
align-items: stretch;
|
||||
}
|
||||
.matches-players {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
max-height: min(70vh, 560px);
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
padding-right: 2px;
|
||||
}
|
||||
.matches-board .match-list {
|
||||
gap: 12px;
|
||||
}
|
||||
.rankings-empty {
|
||||
padding: 48px 0;
|
||||
text-align: center;
|
||||
@@ -3344,7 +3441,7 @@ a.streamer-avatar-wrap:hover .streamer-avatar {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
gap: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
background: transparent;
|
||||
@@ -3391,14 +3488,58 @@ a.streamer-avatar-wrap:hover .streamer-avatar {
|
||||
padding-top: 2px;
|
||||
}
|
||||
.streamer-video-frame {
|
||||
/* Default 9:16; JS may set aspect-ratio from video metadata */
|
||||
/* Real ratio set by JS after metadata; pending uses compact skeleton. */
|
||||
width: 100%;
|
||||
aspect-ratio: 9 / 16;
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
background: #0a0a0a;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.streamer-video-frame.is-pending {
|
||||
aspect-ratio: 16 / 9;
|
||||
height: auto;
|
||||
max-height: none;
|
||||
position: relative;
|
||||
background: linear-gradient(90deg, #121212 0%, #1a1a1a 45%, #121212 100%);
|
||||
background-size: 200% 100%;
|
||||
animation: streamer-video-skeleton 1.15s ease-in-out infinite;
|
||||
}
|
||||
.streamer-video-frame.is-pending.has-poster {
|
||||
background-color: #0a0a0a;
|
||||
background-size: cover;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
animation: none;
|
||||
}
|
||||
.streamer-video-frame.is-pending::after {
|
||||
content: "视频加载中";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.04em;
|
||||
color: rgba(255, 255, 255, 0.38);
|
||||
pointer-events: none;
|
||||
}
|
||||
.streamer-video-frame.is-pending.has-poster::after {
|
||||
content: "";
|
||||
background: linear-gradient(
|
||||
to top,
|
||||
rgba(0, 0, 0, 0.35) 0%,
|
||||
rgba(0, 0, 0, 0.08) 45%,
|
||||
transparent 100%
|
||||
);
|
||||
}
|
||||
.streamer-video-frame.is-pending .streamer-video {
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
@keyframes streamer-video-skeleton {
|
||||
0% { background-position: 100% 0; }
|
||||
100% { background-position: -100% 0; }
|
||||
}
|
||||
.streamer-video-frame.is-landscape {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user