diff --git a/frontend/index.html b/frontend/index.html index 9e50d6f..c751f94 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -3,6 +3,7 @@ + Walkup @@ -10,4 +11,3 @@ - diff --git a/frontend/public/icon.svg b/frontend/public/icon.svg index 743f944..fbba96b 100644 --- a/frontend/public/icon.svg +++ b/frontend/public/icon.svg @@ -1,7 +1,8 @@ - + - - - + + - diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index efbe49e..b1f0e98 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -24,6 +24,23 @@ function getRouteDestinationLabel(pathname: string) { } } +function getNavbarPageLabel(pathname: string) { + switch (pathname) { + case "/": + return "Home"; + case "/library": + return "Walkup Clips"; + case "/gameday": + return "Gameday"; + case "/profile": + return "Profile"; + case "/admin": + return "Admin"; + default: + return ""; + } +} + function ProtectedRoute({ children }: { children: ReactElement }) { const location = useLocation(); const { data, isLoading } = useSession(); @@ -210,6 +227,7 @@ function ShellLayout() { const [navOpen, setNavOpen] = useState(false); const walkup = useWalkupContext(); const location = useLocation(); + const currentPageLabel = getNavbarPageLabel(location.pathname); const showNavbar = walkup.sessionQuery.data?.authenticated === true; const showTeamSelectionModal = walkup.isTeamSnap && walkup.teamsQuery.isFetched && !walkup.hasSelectedTeam; const shellClassName = showNavbar ? "shell is-authenticated" : "shell is-authless"; @@ -235,9 +253,14 @@ function ShellLayout() { {showNavbar ? (
-
- Baseball audio ops - Walkup +
+ +
+ Walkup + {currentPageLabel ? {currentPageLabel} : null} +
) : null} -
-

Gameday mode

-

{selectedGame ? formatGameTitle(selectedGame) : "Select a game for gameday"}

-

- Any player can run gameday. The player list now follows the event lineup first, then RSVP order, and each expanded - row keeps pinned clips at the top of the player's library. -

-
@@ -363,12 +355,10 @@ export function GamedayPage() { const availability = (availabilityQuery.data ?? []).find( (entry) => String(entry.memberId) === memberId, ) ?? null; - const pinCount = assignmentList.filter((assignment) => assignment.external_player_id === memberId).length; const isExpanded = memberId === expandedPlayerId; const expansionId = `player-clips-${memberId}`; const availabilityStatusCode = availability?.statusCode ?? null; const playerMeta = [ - pinCount ? `${pinCount} pinned clip${pinCount === 1 ? "" : "s"}` : null, lineupEntry?.label ?? null, ].filter(Boolean); diff --git a/frontend/src/styles.css b/frontend/src/styles.css index be4081c..73f7c9b 100644 --- a/frontend/src/styles.css +++ b/frontend/src/styles.css @@ -126,6 +126,27 @@ select { font-style: normal; } +.site-brand-mark { + display: inline-flex; + align-items: center; + justify-content: center; + color: var(--accent-soft); + font-size: 1.4rem; + line-height: 1; + margin-left: 0.15rem; +} + +.site-brand-copy { + display: grid; + gap: 0.16rem; +} + +.current-page-label { + color: rgba(255, 255, 255, 0.68); + font-size: 0.72rem; + line-height: 1.2; +} + .clip-list-add-button .bootstrap-icon { font-size: 1.2rem; }