FEAT: Click on chatter's username to visit profile;

REFACTOR: Formatting;
This commit is contained in:
Chris-1010
2025-02-17 05:01:55 +00:00
parent c3fd9f5dee
commit ecb26223df
3 changed files with 39 additions and 11 deletions

View File

@@ -205,7 +205,7 @@ const UserPage: React.FC = () => {
{/* Content Section */}
<div
id="content"
className="col-span-2 bg-gray-800 rounded-lg p-6 grid grid-rows-[auto_1fr] items-center justify-center"
className="col-span-2 bg-gray-800 rounded-lg p-6 grid grid-rows-[auto_1fr] text-center items-center justify-center"
>
{userPageVariant === "streamer" && (
<>

View File

@@ -102,11 +102,12 @@ const VideoPage: React.FC<VideoPageProps> = ({ streamerId }) => {
<div
id="container"
className={`grid ${isChatOpen ? "w-[100vw]" : "w-[125vw]"
} grid-rows-[auto_1fr] bg-gray-900 h-full grid-cols-[auto_25vw] transition-all`}
className={`grid ${
isChatOpen ? "w-[100vw]" : "w-[125vw]"
} grid-rows-[auto_1fr] bg-gray-900 h-full grid-cols-[auto_25vw] transition-all`}
>
<div className="relative">
<VideoPlayer streamId={streamerId} />
<VideoPlayer />
</div>
<ToggleButton
@@ -116,7 +117,9 @@ const VideoPage: React.FC<VideoPageProps> = ({ streamerId }) => {
>
{isChatOpen ? "Hide Chat" : "Show Chat"}
<small className="absolute right-0 left-0 -bottom-0 group-hover:-bottom-5 opacity-0 group-hover:opacity-100 text-white transition-all">Press C</small>
<small className="absolute right-0 left-0 -bottom-0 group-hover:-bottom-5 opacity-0 group-hover:opacity-100 text-white transition-all">
Press C
</small>
</ToggleButton>
<ChatPanel
@@ -193,7 +196,10 @@ const VideoPage: React.FC<VideoPageProps> = ({ streamerId }) => {
<span className="text-gray-400 text-[0.75em]">Started</span>
<span className="text-[0.75em]">
{streamData
? `${Math.floor((Date.now() - new Date(streamData.startTime).getTime()) / 3600000)} hours ago`
? `${Math.floor(
(Date.now() - new Date(streamData.startTime).getTime()) /
3600000
)} hours ago`
: "Loading..."}
</span>
</div>
@@ -213,11 +219,17 @@ const VideoPage: React.FC<VideoPageProps> = ({ streamerId }) => {
Subscribe
</button>
</div>
</div>
{showCheckout && <CheckoutForm onClose={() => setShowCheckout(false)} streamerID={streamerId}/>}
{showCheckout && (
<CheckoutForm
onClose={() => setShowCheckout(false)}
streamerID={streamerId}
/>
)}
{showReturn && <Return />}
{showAuthModal && <AuthModal onClose={() => setShowAuthModal(false)} />}
{showAuthModal && (
<AuthModal onClose={() => setShowAuthModal(false)} />
)}
</div>
</div>
</SocketProvider>