update overlay

This commit is contained in:
Pas 2025-05-18 16:27:45 -06:00
parent ec7b281103
commit 3dc6a0db0c
3 changed files with 11 additions and 4 deletions

View file

@ -44,8 +44,8 @@ export function WatchPartyStatus() {
return (
<div
className={`absolute top-2 right-2 z-50 p-2 bg-mediaCard-shadow bg-opacity-70 backdrop-blur-sm rounded-md text-white text-xs
flex flex-col items-end gap-1 max-w-[250px] transition-all duration-300
className={`absolute top-4 right-4 z-50 p-2 bg-mediaCard-shadow bg-opacity-70 backdrop-blur-sm rounded-md text-white text-xs
flex flex-col items-end gap-1 max-w-[260px] transition-all duration-300
${showNotification ? "ring-1 ring-buttons-purple shadow-lg shadow-buttons-purple" : ""}`}
>
<div className="flex gap-2 w-full justify-between items-center">

View file

@ -1,7 +1,6 @@
import { ReactNode, RefObject, useEffect, useRef } from "react";
import { OverlayDisplay } from "@/components/overlays/OverlayDisplay";
import { WatchPartyStatus } from "@/components/player/atoms/WatchPartyStatus";
import { CastingInternal } from "@/components/player/internals/CastingInternal";
import { HeadUpdater } from "@/components/player/internals/HeadUpdater";
import { KeyboardEvents } from "@/components/player/internals/KeyboardEvents";
@ -99,7 +98,6 @@ export function Container(props: PlayerProps) {
<WebhookReporter />
<WatchPartyResetter />
<div className="relative h-screen overflow-hidden">
<WatchPartyStatus />
<VideoClickTarget showingControls={props.showingControls} />
<HeadUpdater />
{props.children}

View file

@ -5,6 +5,7 @@ import { BrandPill } from "@/components/layout/BrandPill";
import { Player } from "@/components/player";
import { SkipIntroButton } from "@/components/player/atoms/SkipIntroButton";
import { UnreleasedEpisodeOverlay } from "@/components/player/atoms/UnreleasedEpisodeOverlay";
import { WatchPartyStatus } from "@/components/player/atoms/WatchPartyStatus";
import { Widescreen } from "@/components/player/atoms/Widescreen";
import { useShouldShowControls } from "@/components/player/hooks/useShouldShowControls";
import { useSkipTime } from "@/components/player/hooks/useSkipTime";
@ -105,6 +106,14 @@ export function PlayerPart(props: PlayerPartProps) {
<Player.SkipForward iconSizeClass="text-3xl" inControl={inControl} />
</Player.CenterMobileControls>
<div
className={`absolute right-4 z-50 transition-all duration-300 ease-in-out ${
showTargets ? "top-16" : "top-1"
}`}
>
<WatchPartyStatus />
</div>
<Player.TopControls show={showTargets}>
<div className="grid grid-cols-[1fr,auto] xl:grid-cols-3 items-center">
<div className="flex space-x-3 items-center">