OTSSigns/OTSSigns-Website
1
0
Fork 0
Code Issues Pull Requests 6 Actions Packages Projects Releases Wiki Activity

Update event display styles and replace event time element with cursor for improved visibility

Browse Source
This commit is contained in:
Matt Batchelder
2026-02-21 13:14:41 -05:00
parent 5783fa7ebc
commit ebb4b7668c
2 changed files with 29 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
theme/assets/css/main.css
View File

@@ -4270,7 +4270,11 @@ p:last-child { margin-bottom: 0; }
/* ══════════════════════════════════
2 — EVENT DISPLAY
══════════════════════════════════ */
.uc-inner--event { gap: 0; padding: 16px 18px; }
.uc-inner--event {
gap: 0;
padding: 16px 18px;
position: relative;
}
.uc-event-header {
width: 100%;
@@ -4343,38 +4347,37 @@ p:last-child { margin-bottom: 0; }
.uc-event-title--active::after { animation: uc-event-shimmer 2.2s linear infinite; }
.uc-event-title--accent::after { animation: uc-event-shimmer 2.2s linear infinite 1.1s; }
.uc-event-time-now {
.uc-event-cursor {
position: absolute;
top: 28px;
left: 26px;
background: var(--color-accent);
color: #fff;
font-size: 7px;
font-weight: 700;
padding: 2px 5px;
border-radius: 2px;
white-space: nowrap;
top: 32px;
left: 0;
right: 0;
height: 2px;
background: var(--color-primary);
opacity: .85;
pointer-events: none;
display: flex;
align-items: center;
gap: 3px;
letter-spacing: 0.3px;
animation: uc-event-time-pulse 2s ease-in-out infinite;
box-shadow: 0 0 8px rgba(var(--color-primary-rgb), 0.4);
animation: uc-event-time-progress 20s linear infinite;
}
.uc-event-time-now-val {
font-family: 'Monaco', 'Courier New', monospace;
font-size: 8px;
font-weight: 700;
letter-spacing: 0px;
.uc-event-cursor::before {
content: '';
position: absolute;
left: -6px;
top: -4px;
width: 12px;
height: 10px;
background: var(--color-primary);
border-radius: 50%;
box-shadow: 0 0 8px rgba(var(--color-primary-rgb), 0.6);
}
@keyframes uc-event-shimmer {
0% { transform: translateX(-150%); }
100% { transform: translateX(250%); }
}
@keyframes uc-event-time-pulse {
0%, 100% { box-shadow: 0 0 0 0 rgba(var(--color-accent-rgb, 255, 107, 29), 0.7); }
50% { box-shadow: 0 0 0 3px rgba(var(--color-accent-rgb, 255, 107, 29), 0); }
@keyframes uc-event-time-progress {
0% { top: 32px; }
100% { top: calc(100% - 10px); }
}
/* ══════════════════════════════════
@@ -4547,7 +4550,7 @@ p:last-child { margin-bottom: 0; }
.uc-menu-row--highlight .uc-menu-price,
.uc-event-title--active::after,
.uc-event-title--accent::after,
.uc-event-time-now,
.uc-event-cursor,
.uc-db-bar--1, .uc-db-bar--2, .uc-db-bar--3, .uc-db-bar--4,
.uc-wf-dot::after,
.uc-wf-arrow { animation: none !important; }

2
theme/blocks/index.php
View File

@@ -1928,7 +1928,7 @@ function oribi_uc_anim_inner( $mod ) {
case 'event':
return '
<div class="uc-inner uc-inner--event" aria-hidden="true">
<div class="uc-event-time-now">NOW <span class="uc-event-time-now-val">10:45</span></div>
<div class="uc-event-cursor"></div>
<div class="uc-event-header">Schedule</div>
<div class="uc-event-row">
<div class="uc-event-time">9:00</div>