Skip to content

Commit c3be4e4

Browse files
aster-voidaster-void
authored
scroll to top (#267)
1 parent 7705f0a commit c3be4e4

File tree

11 files changed

+61
-72
lines changed

11 files changed

+61
-72
lines changed

‎web/src/app/[locale]/(auth)/chat/[id]/page.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,7 @@ function Load({ room }: { room: string }) {
9999
}
100100
return (
101101
<>
102-
<div className="fixed flex w-full items-center bg-stone-200 py-2">
102+
<div className="fixed z-10 flex w-full items-center bg-stone-200 py-2">
103103
<Link href={"/chat"} className="mx-2">
104104
<AiOutlineLeft size={25} />
105105
</Link>

‎web/src/app/[locale]/(auth)/layout.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,10 +12,10 @@ export default function Layout({ children }: { children: React.ReactNode }) {
1212
<AuthProvider>
1313
<UserProvider>
1414
<ChatNotificationProvider>
15-
<div className="flex h-full flex-col">
15+
<div className="flex min-h-fit flex-col bg-tGray">
1616
<Header />
1717
<ToastProvider>
18-
<main className="flex-1 overflow-y-auto bg-tGray ">{children}</main>
18+
<div className="flex-grow pb-16">{children}</div>
1919
<Footer />
2020
</ToastProvider>
2121
</div>

‎web/src/app/[locale]/(auth)/settings/layout.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ export default function Layout({ children }: { children: React.ReactNode }) {
4646
return (
4747
<>
4848
<UserFormProvider loadPreviousData>
49-
<div className="flex h-screen flex-col sm:flex-row">
49+
<div className="flex flex-col sm:flex-row">
5050
<div className="hidden sm:block">
5151
<SideNav />
5252
</div>

‎web/src/app/[locale]/layout.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,13 +19,13 @@ export default async function RootLayout({
1919
// side is the easiest way to get started
2020
const messages = await getMessages();
2121
return (
22-
<html lang={locale} className="h-full" data-theme="light">
22+
<html lang={locale} className="h-screen bg-tGray" data-theme="light">
2323
<head>
2424
<meta charSet="UTF-8" />
2525
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
2626
<title>ut-bridge</title>
2727
</head>
28-
<body className="h-full">
28+
<body className="flex h-screen flex-col overflow-y-auto">
2929
<NextIntlClientProvider messages={messages}>{children}</NextIntlClientProvider>
3030
</body>
3131
</html>

‎web/src/app/[locale]/login/page.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ export default function Login() {
1010

1111
return (
1212
<>
13-
<div className="flex h-screen justify-center sm:items-center">
13+
<div className="flex flex-grow justify-center bg-white sm:items-center">
1414
<div className="p-6 text-center sm:rounded-lg sm:border sm:shadow-md">
1515
<p className="mt-10 sm:hidden">UT-Bridge</p>
1616
<p className="mt-10 mb-20 font-bold text-3xl">{t("title")}</p>

‎web/src/app/[locale]/page.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ export default function LandingPage() {
1313
return (
1414
<>
1515
<Header />
16-
<div className="mt-10 flex w-full flex-col-reverse justify-center xl:flex-row">
16+
<main className="flex w-full flex-grow flex-col-reverse justify-center bg-white pt-10 xl:flex-row">
1717
<Image
1818
src={pathname.startsWith("/ja") ? "/app_sample_ja.png" : "/app_sample_en.png"}
1919
alt="app sample image"
@@ -39,7 +39,7 @@ export default function LandingPage() {
3939
</Link>
4040
<LanguageSwitcher />
4141
</div>
42-
</div>
42+
</main>
4343
</>
4444
);
4545
}

‎web/src/app/layout.tsx‎

Lines changed: 1 addition & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { useLocale } from "next-intl";
21
import "../tailwind.css";
32

43
export const runtime = "edge";
@@ -7,15 +6,5 @@ export default function RootLayout({
76
}: Readonly<{
87
children: React.ReactNode;
98
}>) {
10-
const locale = useLocale();
11-
return (
12-
<html className="h-full" data-theme="light" lang={locale}>
13-
<head>
14-
<meta charSet="UTF-8" />
15-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
16-
<title>ut-bridge</title>
17-
</head>
18-
<body className="h-full">{children}</body>
19-
</html>
20-
);
9+
return children;
2110
}

‎web/src/components/Footer.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { AiFillMessage, AiFillSetting, AiOutlineMessage, AiOutlineSetting, AiOut
55
export default function Footer() {
66
const path = useNormalizedPathname();
77
return (
8-
<footer className="flex h-16 w-full items-center justify-around bg-tBlue sm:hidden">
8+
<footer className="fixed bottom-0 flex h-16 w-full items-center justify-around bg-tBlue sm:hidden">
99
<Link href={"/community"}>
1010
<AiOutlineTeam size={30} strokeWidth={path.startsWith("/community") ? 35 : 0} color="white" fill="white" />
1111
</Link>

‎web/src/components/Header.tsx‎

Lines changed: 46 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -28,50 +28,52 @@ export default function Header() {
2828
}
2929

3030
return (
31-
<header className="flex h-16 w-full items-center bg-tBlue">
32-
<Link href={me ? "/community" : "/"} passHref className="px-4">
33-
<AppIcon width={36} height={36} />
34-
</Link>
35-
<Link href={me ? "/community" : "/"} className="hidden cursor-pointer px-4 text-2xl text-white sm:block">
36-
UT-Bridge
37-
</Link>
38-
{pathname === "/login" || pathname === "/registration" || pathname === "" ? (
39-
<>
40-
<p className="absolute right-1/2 translate-x-1/2 font-bold text-white text-xl sm:hidden">{title}</p>
41-
</>
42-
) : (
43-
<>
44-
<Link
45-
className={`hidden h-full cursor-pointer content-center px-4 text-white text-xl transition-colors duration-200 sm:block ${
46-
pathname === "/community" ? "bg-focus" : "hover:bg-focus"
47-
}`}
48-
href="/community"
49-
>
50-
{t("community.title")}
51-
</Link>
52-
<Link
53-
className={`hidden h-full cursor-pointer content-center px-4 text-white text-xl transition-colors duration-200 sm:block ${
54-
pathname === "/chat" ? "bg-focus" : "hover:bg-focus"
55-
}`}
56-
href="/chat"
57-
>
58-
{t("chat.title")}
59-
</Link>
60-
<Link
61-
className={`hidden h-full cursor-pointer content-center px-4 text-white text-xl transition-colors duration-200 sm:block ${
62-
pathname.startsWith("/settings") ? "bg-focus" : "hover:bg-focus"
63-
}`}
64-
href="/settings"
65-
>
66-
{t("settings.title")}
67-
</Link>
68-
<p className="absolute right-1/2 translate-x-1/2 font-bold text-white text-xl sm:hidden">{title}</p>
69-
<Link href="/settings/basic" className="absolute right-4 flex cursor-pointer items-center gap-4">
70-
<Avatar size={40} src={me?.imageUrl} />
71-
{me?.name && <p className="hidden text-white text-xl sm:block">{me.name}</p>}
72-
</Link>
73-
</>
74-
)}
31+
<header className="sticky top-0 z-10 h-16 w-full bg-tBlue">
32+
<div className="flex h-16 items-center">
33+
<Link href={me ? "/community" : "/"} passHref className="px-4">
34+
<AppIcon width={36} height={36} />
35+
</Link>
36+
<Link href={me ? "/community" : "/"} className="hidden cursor-pointer px-4 text-2xl text-white sm:block">
37+
UT-Bridge
38+
</Link>
39+
{pathname === "/login" || pathname === "/registration" || pathname === "" ? (
40+
<>
41+
<p className="absolute right-1/2 translate-x-1/2 font-bold text-white text-xl sm:hidden">{title}</p>
42+
</>
43+
) : (
44+
<>
45+
<Link
46+
className={`hidden h-full cursor-pointer content-center px-4 text-white text-xl transition-colors duration-200 sm:block ${
47+
pathname === "/community" ? "bg-focus" : "hover:bg-focus"
48+
}`}
49+
href="/community"
50+
>
51+
{t("community.title")}
52+
</Link>
53+
<Link
54+
className={`hidden h-full cursor-pointer content-center px-4 text-white text-xl transition-colors duration-200 sm:block ${
55+
pathname === "/chat" ? "bg-focus" : "hover:bg-focus"
56+
}`}
57+
href="/chat"
58+
>
59+
{t("chat.title")}
60+
</Link>
61+
<Link
62+
className={`hidden h-full cursor-pointer content-center px-4 text-white text-xl transition-colors duration-200 sm:block ${
63+
pathname.startsWith("/settings") ? "bg-focus" : "hover:bg-focus"
64+
}`}
65+
href="/settings"
66+
>
67+
{t("settings.title")}
68+
</Link>
69+
<p className="absolute right-1/2 translate-x-1/2 font-bold text-white text-xl sm:hidden">{title}</p>
70+
<Link href="/settings/basic" className="absolute right-4 flex cursor-pointer items-center gap-4">
71+
<Avatar size={40} src={me?.imageUrl} />
72+
{me?.name && <p className="hidden text-white text-xl sm:block">{me.name}</p>}
73+
</Link>
74+
</>
75+
)}
76+
</div>
7577
</header>
7678
);
7779
}

‎web/src/components/Loading.tsx‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,9 @@ const debug_mode = false;
22
export default function Loading(_props: { stage: string }) {
33
return (
44
<>
5-
<div className="flex h-screen flex-col items-center justify-center">
6-
<div className="mr-auto ml-auto max-h-8 w-fit flex-1">
7-
<span className="loading loading-xl loading-spinner" />
8-
{debug_mode && ` loading stage: ${_props.stage}`}
9-
</div>
5+
<div className="fixed top-[50vh] left-0 flex w-full flex-row justify-center">
6+
<span className="loading loading-xl loading-spinner" />
7+
{debug_mode && ` loading stage: ${_props.stage}`}
108
</div>
119
</>
1210
);

0 commit comments

Comments
 (0)