Skip to main content

Page Navigation Components

The PageNavigation component is a navigation bar that provides a back button, a title, and a share button. It is designed to be responsive and adapts to different screen sizes.

Props​

  • title (optional): A string that represents the title to be displayed in the navigation bar.
  • hideTitleUntilScroll (optional): A boolean that determines whether the title should be hidden until the user scrolls past a certain point. Defaults to false.

Usage​

import { PageNavigation } from "@/components/complex/PageNavigation/PageNavigation";

const MyPage = () => {
  return (
    <PageNavigation title="My Page Title" hideTitleUntilScroll={true} />
  );
};

PlayerNav Component​

The PlayerNav component is a navigation bar for the Player Component that provides a back button and optionally displays a title and detail text. It is designed to be responsive and adapts to different screen sizes.

Props​

  • title (optional): A string that represents the title to be displayed in the navigation bar.
  • detail (optional): A string that represents additional detail text to be displayed below the title.

Usage​

import { PlayerNav } from "@/components/complex/PlayerNav/PlayerNav";

const MyPlayerPage = () => {
  return (
    <PlayerNav title="Player Title" detail="Additional details about the player" />
  );
};