Skip to content

fix: login page reponsiveness #22

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jun 11, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
72 changes: 36 additions & 36 deletions src/app/(auth)/login/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,10 +16,10 @@ export const metadata: Metadata = {
export default async function Page() {
return (
<div className="grid min-h-dvh md:grid-cols-2">
<div className="bg-card/50 hidden place-items-center border-r px-6 md:grid lg:px-0">
<div className="bg-card/50 hidden place-items-center border-r px-8 md:grid lg:px-0">
<div className="flex w-full max-w-100 flex-col gap-4">
<ShieldCheck className="text-muted-foreground size-15 stroke-1" />
<h4 className="text-4xl font-black">Your data is yours.</h4>
<h4 className="text-3xl font-black lg:text-4xl">Your data is yours.</h4>
<div className="text-muted-foreground flex gap-2 text-sm">
<Box className="size-5 shrink-0" />
<span>Gitloom is decentralized and doesn&apos;t rely on any cetralized database.</span>
Expand All @@ -38,44 +38,44 @@ export default async function Page() {
</div>
</div>
</div>
<div className="mx-auto flex w-full max-w-75 flex-col items-center justify-center gap-4">
<div className="flex items-center gap-4">
<div className="grid place-items-center px-4 lg:px-0">
<div className="flex w-full max-w-75 flex-col items-center justify-center gap-4">
<GitloomIcon className="size-7" />
<GitloomTextIcon className="h-5 w-auto" />
</div>
<span className="text-muted-foreground text-center text-sm">
The Git-native CMS for modern content workflows.
</span>
<div className="flex w-full flex-col gap-4">
<form
onSubmit={async () => {
'use server';
await signIn('github', {
redirectTo: '/login/success',
});
}}
>
<Button type="submit" size={'default'} className="w-full">
<GithubIcon className="size-5" />
Sign in with Github
<span className="text-muted-foreground text-center text-sm">
The Git-native CMS for modern content workflows.
</span>
<div className="flex w-full flex-col gap-4">
<form
onSubmit={async () => {
'use server';
await signIn('github', {
redirectTo: '/login/success',
});
}}
>
<Button type="submit" size={'default'} className="w-full">
<GithubIcon className="size-5" />
Sign in with Github
</Button>
</form>
<Button size={'default'} variant={'secondary'} disabled>
<GitlabIcon className="fill-foreground size-5" />
Sign in with Gitlab
</Button>
</form>
<Button size={'default'} variant={'secondary'} disabled>
<GitlabIcon className="fill-foreground size-5" />
Sign in with Gitlab
</Button>
</div>
<span className="text-muted-foreground mt-4 text-center text-sm">
By signing in, you agree to our <br />
<Link href={'/legal/terms-of-service'} className="hover:underline">
terms of service
</Link>{' '}
and{' '}
<Link href={'/legal/privacy-policy'} className="hover:underline">
privacy policy
</Link>
.
</span>
</div>
<span className="text-muted-foreground mt-4 text-center text-sm">
By signing in, you agree to our <br />
<Link href={'/legal/terms-of-service'} className="hover:underline">
terms of service
</Link>{' '}
and{' '}
<Link href={'/legal/privacy-policy'} className="hover:underline">
privacy policy
</Link>
.
</span>
</div>
</div>
);
Expand Down
6 changes: 3 additions & 3 deletions src/app/(auth)/login/success/login-redirect.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -67,11 +67,11 @@ export default function LoginRedirect() {
value={value}
gaugePrimaryColor="var(--color-muted-foreground)"
gaugeSecondaryColor="var(--color-muted)"
className="size-30 stroke-1 [&>span[data-current-value]]:hidden"
className="size-20 sm:size-30 [&>span[data-current-value]]:hidden"
/>
<GitloomIcon className="absolute size-10" />
<GitloomIcon className="absolute size-7 sm:size-10" />
</div>
<div className="relative text-sm [&>span]:whitespace-nowrap">
<div className="relative text-xs sm:text-sm [&>span]:whitespace-nowrap">
{tasks.map((task, idx) => (
<span
key={idx}
Expand Down