diff --git a/static/script.js b/static/script.js index edd12d1..46b8297 100644 --- a/static/script.js +++ b/static/script.js @@ -1353,18 +1353,24 @@ function renderEvents() { return `
${event.side === "home" ? cardHtml : ""}
-
- ${escapeHtml(event.minute)} - ${ - event.id !== null && event.id !== undefined && event.id !== "" - ? `` - : "" - } -
-
${event.side === "away" ? cardHtml : ""}
+
+ ${ + event.id !== null && event.id !== undefined && event.id !== "" + ? `` + : "" + } + + + ${escapeHtml(event.minute)} + +
+ +
${event.side === "away" ? cardHtml : ""}
`; }).join(""); diff --git a/static/styles.css b/static/styles.css index 22a4bc2..34a4c19 100644 --- a/static/styles.css +++ b/static/styles.css @@ -2293,16 +2293,62 @@ body:not(.edit-mode-on) .referee-search { border-radius: 6px; } +.event-time-editable { + position: relative; + display: flex; + align-items: center; + justify-content: center; + min-width: 72px; +} + +.event-time-label { + font-weight: 600; +} + .event-time-edit-btn { - margin-left: 4px; - border: none; - background: transparent; - color: inherit; - cursor: pointer; - opacity: 0.55; + position: absolute; + top: -6px; + left: -6px; + + width: 20px; + height: 20px; + + border: 1px solid rgba(255,255,255,0.14); + border-radius: 6px; + + background: rgba(20,20,20,0.92); + color: #d0d0d0; + + display: flex; + align-items: center; + justify-content: center; + font-size: 11px; + cursor: pointer; + + opacity: 0.72; + + transition: + background 0.18s ease, + border-color 0.18s ease, + transform 0.18s ease, + opacity 0.18s ease; } .event-time-edit-btn:hover { + background: #2d5cff; + border-color: #5f84ff; + color: #fff; + opacity: 1; + transform: scale(1.08); +} + +.event-time-edit-btn:active { + transform: scale(0.96); +} + +.event-time-edit-btn:focus-visible { + outline: 2px solid rgba(95,132,255,0.45); + outline-offset: 2px; } \ No newline at end of file