DHBW-WE/MeetUp
5
0
Fork 0
Code Issues 7 Pull requests 11 Projects 1 Releases 5 Packages 1 Wiki Activity Actions 1

feat(ui): Improve login card design and theme customization

Browse source 
Refactor the `Button` component, add new `LoginCard` component, update `ThemePicker` component, edit global CSS styles to include card background and foreground and style the login page, including the logo and login form.
This commit is contained in:
Maximilian Liebmann 2025-05-21 16:42:48 +02:00 • committed by Maximilian Liebmann
parent 9f9c2157f5
commit 4f4e73318a
11 changed files with 122 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

19
src/app/login/page.tsx
View file

@ -2,13 +2,17 @@ import { auth, providerMap } from '@/auth';
import SSOLogin from '@/components/user/sso-login-button';
import LoginForm from '@/components/user/login-form';
import { redirect } from 'next/navigation';
import { Button } from '@/components/ui/button';
import { Button } from '@/components/custom-ui/button';
import Image from 'next/image';
import { Separator } from '@/components/custom-ui/separator';
import Logo from '@/components/logo';
import '@/app/globals.css';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import {
Card,
CardContent,
CardHeader,
} from '@/components/custom-ui/login-card';
import { ThemePicker } from '@/components/user/theme-picker';
import {
HoverCard,
@ -30,14 +34,9 @@ export default async function LoginPage() {
<ThemePicker />
</div>
<div>
<Card className='w-[350px] max-w-screen'>
<CardHeader>
<Logo
colorType='colored'
logoType='secondary'
width={200}
height={200}
></Logo>
<Card className='w-[350px] max-w-screen;'>
<CardHeader className='grid place-items-center'>
<Logo colorType='colored' logoType='secondary'></Logo>
</CardHeader>
<CardContent className='gap-6 flex flex-col items-center'>
<LoginForm />