add alertfeed to display, adjust alert feed opacities

This commit is contained in:
legop3
2026-09-19 22:42:45 -04:00
parent bda740b08d
commit 3ad95b376a
11 changed files with 27 additions and 32 deletions
+2 -2
View File
@@ -381,8 +381,8 @@ function AlertToastShell({ toast, onDismiss, onPause, onResume }) {
const accent = getToastAccent(toast.alert);
const generic = isGenericAlert(toast.alert);
const rgb = getToastRgb(toast.alert);
const genericBackgroundColor = rgb ? `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, 0.18)` : 'rgba(33, 150, 243, 0.18)';
const genericBorderColor = rgb ? `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, 0.45)` : 'rgba(33, 150, 243, 0.45)';
const genericBackgroundColor = rgb ? `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, 0.5)` : 'rgba(33, 150, 243, 0.18)';
const genericBorderColor = rgb ? `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, 1)` : 'rgba(33, 150, 243, 0.45)';
const shellClass = [
'pointer-events-auto w-fit max-w-[80vw] overflow-hidden rounded-md shadow-sm shadow-black/40',
generic ? '' : 'border border-white/10 bg-black/75',
@@ -12,6 +12,7 @@ import DisplayRoverGrid from './components/DisplayRoverGrid.jsx';
import DisplayChatFeed from './components/DisplayChatFeed.jsx';
import DisplayNoticeOverlay from './components/DisplayNoticeOverlay.jsx';
import DisplayPtzOperatorBadge from './components/DisplayPtzOperatorBadge.jsx';
import AlertFeed from '../../components/AlertFeed/index.jsx';
export default function ServerDisplayContent() {
const { session } = useSession();
@@ -38,11 +39,6 @@ export default function ServerDisplayContent() {
<div className="display-page flex h-screen w-screen flex-col overflow-hidden bg-black text-slate-100">
<div className="flex h-[8vh] min-h-[4rem] shrink-0 overflow-hidden">
<OnlinePeopleStrip users={session?.users || []} />
{/* The PTZ operator belongs in the same information band as the people
strip because it is another "who is active right now" signal. Making
it a flex sibling lets the badge reserve real layout space when it
appears, which pushes the scrolling strip left instead of covering
the rover or chat areas. */}
<DisplayPtzOperatorBadge />
</div>
<div className="min-h-0 flex-[0.72]">
@@ -53,9 +49,8 @@ export default function ServerDisplayContent() {
</div>
<DisplayNoticeOverlay />
<RewardRunOverlay />
{/* Display is spectator-like: every Discord-hosted replay should take over
this physical-room board, not only replays requested by this browser. */}
<ReplayReadyPopup replay={latestReplay} onClose={clearLatestReplay} />
<ReplayReadyPopup replay={latestReplay} onClose={clearLatestReplay} />
<AlertFeed scale={5} />
</div>
);
}