diff --git a/src/app/me/AboutMe.tsx b/src/app/me/AboutMe.tsx index b347c43..90ff8a5 100644 --- a/src/app/me/AboutMe.tsx +++ b/src/app/me/AboutMe.tsx @@ -18,6 +18,8 @@ import Toast from "@/components/Toast"; import { AuthProviderState } from "@/auth/AuthProvider"; import inputStyles from "@/components/Input.module.css"; import Connection from "@/components/Connection"; +import DiscordIcon from "@/components/icons/DiscordIcon"; +import GitHubIcon from "@/components/icons/GitHubIcon"; type UpdateResponse = { ok: boolean; @@ -202,8 +204,16 @@ export default function AboutMe({
- - + +
diff --git a/src/app/oauth/github/redirect/route.ts b/src/app/oauth/github/redirect/route.ts index b4563d7..d0e0d0b 100644 --- a/src/app/oauth/github/redirect/route.ts +++ b/src/app/oauth/github/redirect/route.ts @@ -53,6 +53,16 @@ export async function GET(request: Request) { const [user, authTicket] = await authTicketOAuth(userId); + if (user?.username !== null) { + return new Response(null, { + status: 302, + headers: { + "Set-Cookie": `ticket=${authTicket.ticket}; Path=/;`, + Location: "/me" + } + }); + } + const username = await provider.getDisplayName(); const email = await provider.getEmail(); const avatarUrl = await provider.getAvatar(); diff --git a/src/app/page.module.css b/src/app/page.module.css index 9e8bee0..965ea47 100644 --- a/src/app/page.module.css +++ b/src/app/page.module.css @@ -7,21 +7,32 @@ height: 100vh; } -.form { +.content { + margin-top: 2rem; display: flex; flex-direction: column; + font-stretch: expanded; + line-height: 1.5; } -.form div { +.content p { + text-align: center; +} + +.icons { display: flex; flex-direction: row; - justify-content: space-between; + align-items: center; + padding: 1rem; } -.form div label { - margin-right: 1rem; +.icons svg { + width: 4rem; + height: 4rem; + padding: 0.5rem; } -.form div input { - width: 15rem; +.icons svg:hover { + background-color: var(--bg-dark); + border-radius: 0.25rem; } diff --git a/src/app/page.tsx b/src/app/page.tsx index dd5880e..7cdcc21 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,25 +1,31 @@ import Logo from "@/components/Logo"; import styles from "./page.module.css"; +import NotNetIcon from "@/components/icons/NotNetIcon"; +import GitHubIcon from "@/components/icons/GitHubIcon"; +import DiscordIcon from "@/components/icons/DiscordIcon"; export default function Home() { return (
-

- login -
- register with discord - register with github -

+
+

login with

+ +
+ + + + + + + + + + + +
+
); } diff --git a/src/app/register/page.tsx b/src/app/register/page.tsx index 437ea29..7e0de96 100644 --- a/src/app/register/page.tsx +++ b/src/app/register/page.tsx @@ -20,10 +20,6 @@ function avatarUrlSource(url: URL): ValidAuthProvider | null { return null; } -function avatarUrlAllowed(url: URL): boolean { - return avatarUrlSource(url) !== null; -} - export default async function Page({ searchParams }: { diff --git a/src/components/Connection.module.css b/src/components/Connection.module.css index 923d8cc..84b454d 100644 --- a/src/components/Connection.module.css +++ b/src/components/Connection.module.css @@ -12,13 +12,25 @@ } .connection svg { - height: 1.5rem; + width: 3rem; + height: 3rem; margin-left: auto; } +.connection .dot { + width: 1rem; + height: 1rem; + + margin: 1rem; + background-color: var(--fg); + border-radius: 50%; +} + .iconContainer { font-size: 2.5em; margin-right: 0.75rem; + display: flex; + align-items: center; } .info { diff --git a/src/components/Connection.tsx b/src/components/Connection.tsx index 9443ead..5db0066 100644 --- a/src/components/Connection.tsx +++ b/src/components/Connection.tsx @@ -9,11 +9,13 @@ import { useRouter } from "next/navigation"; export default function Connection({ service, unavailable = false, - authState + authState, + icon }: { service: string; unavailable?: boolean; authState?: AuthProviderState; + icon?: () => JSX.Element; }) { const router = useRouter(); const [changing, setChanging] = React.useState(false); @@ -50,7 +52,9 @@ export default function Connection({ onClick={handleClick} disabled={changing} > -
+
+ {icon ? icon() : } +
{service}
{authState?.connected !== false ? ( diff --git a/src/components/Logo.tsx b/src/components/Logo.tsx index 24ec7fc..fa310fb 100644 --- a/src/components/Logo.tsx +++ b/src/components/Logo.tsx @@ -38,13 +38,7 @@ export default function Logo() { height="21.4354612" > -