mirror of
https://github.com/legop3/MultiRoombaRover.git
synced 2026-09-15 17:12:59 -04:00
27 lines
875 B
React
27 lines
875 B
React
// Rover Help Overlay
|
|
// Purpose: Gives every rover surface one unmistakable, responsive HELP treatment.
|
|
// Scope: Renders only the shared visual; server roster state decides when it is active.
|
|
import AutoFitText from '../AutoFitText/index.jsx';
|
|
import './styles.css';
|
|
|
|
export default function RoverHelpOverlay({ active = false }) {
|
|
if (!active) return null;
|
|
|
|
return (
|
|
<div
|
|
className="rover-help-overlay pointer-events-none absolute inset-0 z-50 overflow-hidden border-[clamp(0.2rem,1.2cqw,1rem)] border-white bg-red-600 p-[clamp(0.2rem,2cqw,1.5rem)] text-white"
|
|
role="status"
|
|
aria-label="Rover needs help"
|
|
>
|
|
<AutoFitText
|
|
fitHeight
|
|
minSize={8}
|
|
maxSize={1400}
|
|
className="font-black tracking-tight text-white drop-shadow-[0_0_0.08em_rgba(0,0,0,1)]"
|
|
>
|
|
HELP
|
|
</AutoFitText>
|
|
</div>
|
|
);
|
|
}
|