new page thing

This commit is contained in:
2025-07-27 14:12:25 +03:00
parent c7d3cd85be
commit 281b87705d
6 changed files with 143 additions and 81 deletions

View File

@@ -3,6 +3,8 @@ import { Geist, Geist_Mono } from "next/font/google";
import "./globals.css";
import { TooltipProvider } from "@/components/ui/tooltip";
import { Toaster } from "@/components/ui/toaster";
import Image from "next/image";
import { QuickTopUI, QuickTopUILogoPart } from "@/components/site/QuickTopUI";
const geistSans = Geist({
variable: "--font-geist-sans",
@@ -15,7 +17,7 @@ const geistMono = Geist_Mono({
});
export const metadata: Metadata = {
title: "ocbwoy3-chan-blox",
title: "home | ocbwoy3-chan's roblox",
description: "roblox meets next.js i think"
};
@@ -30,7 +32,21 @@ export default function RootLayout({
className={`${geistSans.variable} ${geistMono.variable} antialiased overflow-x-hidden`}
>
<TooltipProvider>
<main>{children}</main>
<main>
<Image
/* window.localStorage.BgImageUrl */
src={"/bg.png"}
width={1920}
height={1080}
className="w-screen h-screen bg-blend-hard-light fixed top-0 left-0 blur-lg opacity-25"
alt=""
/>
<div className="z-10 isolate overflow-scroll no-scrollbar w-screen max-h-screen h-screen antialiased overflow-x-hidden">
<QuickTopUI />
<QuickTopUILogoPart />
{children}
</div>
</main>
<Toaster />
</TooltipProvider>
</body>

View File

@@ -6,8 +6,6 @@ import {
} from "@/components/roblox/FriendsOnline";
import { GameCard } from "@/components/roblox/GameCard";
import { HomeLoggedInHeader } from "@/components/site/HomeUserHeader";
import { OutfitSelector } from "@/components/site/OutfitQuickChooser";
import { QuickTopUI, QuickTopUILogoPart } from "@/components/site/QuickTopUI";
import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
import { Card, CardContent } from "@/components/ui/card";
import {
@@ -16,7 +14,6 @@ import {
} from "@/lib/omniRecommendation";
import { loadThumbnails } from "@/lib/thumbnailLoader";
import { AlertTriangleIcon } from "lucide-react";
import Image from "next/image";
import { useEffect, useState } from "react";
export default function Home() {
@@ -41,65 +38,56 @@ export default function Home() {
return (
<>
<Image src={window.localStorage.BgImageUrl || "/bg.png"} width={1920} height={1080} className="w-screen h-screen bg-blend-hard-light fixed top-0 left-0 blur-lg opacity-25" alt=""/>
<div className="z-10 isolate overflow-scroll no-scrollbar w-screen max-h-screen h-screen antialiased overflow-x-hidden">
<QuickTopUI />
<QuickTopUILogoPart />
<HomeLoggedInHeader />
<div className="h-4" />
<BestFriendsHomeSect className="pt-2" />
<FriendsHomeSect className="pt-2" />
<div className="justify-center w-screen px-8 pt-6">
<Alert variant="default" className="bg-base/50 space-x-2">
<AlertTriangleIcon />
<AlertTitle>Warning</AlertTitle>
<AlertDescription>
This is work in progess, you can follow the
development process on GitHub.
</AlertDescription>
</Alert>
</div>
<div className="p-4 space-y-8 no-scrollbar">
{!rec ? (
<Card>
<CardContent className="p-4">
<div className="h-[200px] flex items-center justify-center">
<div className="animate-pulse text-muted-foreground">
{"Loading..."}
</div>
<HomeLoggedInHeader />
<div className="h-4" />
<BestFriendsHomeSect className="pt-2" />
<FriendsHomeSect className="pt-2" />
<div className="justify-center w-screen px-8 pt-6">
<Alert variant="default" className="bg-base/50 space-x-2">
<AlertTriangleIcon />
<AlertTitle>Warning</AlertTitle>
<AlertDescription>
This is work in progess, you can follow the development
process on GitHub.
</AlertDescription>
</Alert>
</div>
<div className="p-4 space-y-8 no-scrollbar">
{!rec ? (
<Card>
<CardContent className="p-4">
<div className="h-[200px] flex items-center justify-center">
<div className="animate-pulse text-muted-foreground">
{"Loading..."}
</div>
</CardContent>
</Card>
) : (
rec.sorts
.filter((a) =>
SORTS_ALLOWED_IDS.includes(a.topicId)
)
.map((sort, idx) => (
<div key={idx}>
<h1 className="text-2xl pb-2">
{sort.topic}
</h1>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
{(sort.recommendationList || []).map(
(recommendation, idxb) => {
const game =
rec.contentMetadata.Game[
recommendation.contentId.toString()
];
return (
<GameCard
key={idxb}
game={game}
/>
);
}
)}
</div>
</div>
</CardContent>
</Card>
) : (
rec.sorts
.filter((a) => SORTS_ALLOWED_IDS.includes(a.topicId))
.map((sort, idx) => (
<div key={idx}>
<h1 className="text-2xl pb-2">{sort.topic}</h1>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
{(sort.recommendationList || []).map(
(recommendation, idxb) => {
const game =
rec.contentMetadata.Game[
recommendation.contentId.toString()
];
return (
<GameCard
key={idxb}
game={game}
/>
);
}
)}
</div>
))
)}
</div>
</div>
))
)}
</div>
</>
);

7
app/test/page.tsx Normal file
View File

@@ -0,0 +1,7 @@
"use client";
export default function Page() {
return <>
hi
</>
}