vngrup/dress
vngrup/dress
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: localize login page to Indonesian and update branding with new logo and cover image

Browse Source
This commit is contained in:
Yoga Pangestu 2026-04-12 21:28:39 +07:00
parent b116cbb660
commit 8d08473340
5 changed files with 21 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/assets/cover-login.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 175 KiB

BIN
public/assets/logo.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.8 KiB

14
resources/js/components/app-logo-icon.tsx
View File

@ -1,13 +1,3 @@
import type { SVGAttributes } from 'react'; export default function AppLogoIcon() {
return <img src="/assets/logo.webp" alt="Logo" />;
export default function AppLogoIcon(props: SVGAttributes<SVGElement>) {
return (
<svg {...props} viewBox="0 0 40 42" xmlns="http://www.w3.org/2000/svg">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M17.2 5.63325L8.6 0.855469L0 5.63325V32.1434L16.2 41.1434L32.4 32.1434V23.699L40 19.4767V9.85547L31.4 5.07769L22.8 9.85547V18.2999L17.2 21.411V5.63325ZM38 18.2999L32.4 21.411V15.2545L38 12.1434V18.2999ZM36.9409 10.4439L31.4 13.5221L25.8591 10.4439L31.4 7.36561L36.9409 10.4439ZM24.8 18.2999V12.1434L30.4 15.2545V21.411L24.8 18.2999ZM23.8 20.0323L29.3409 23.1105L16.2 30.411L10.6591 27.3328L23.8 20.0323ZM7.6 27.9212L15.2 32.1434V38.2999L2 30.9666V7.92116L7.6 11.0323V27.9212ZM8.6 9.29991L3.05913 6.22165L8.6 3.14339L14.1409 6.22165L8.6 9.29991ZM30.4 24.8101L17.2 32.1434V38.2999L30.4 30.9666V24.8101ZM9.6 11.0323L15.2 7.92117V22.5221L9.6 25.6333V11.0323Z"
/>
</svg>
);
} }

18
resources/js/layouts/auth/auth-split-layout.tsx
View File

@ -11,22 +11,18 @@ export default function AuthSplitLayout({
const { name } = usePage().props; const { name } = usePage().props;
return ( return (
<div className="relative grid h-dvh flex-col items-center justify-center px-8 sm:px-0 lg:max-w-none lg:grid-cols-2 lg:px-0"> <div className="relative grid h-dvh flex-col items-center justify-center px-8 sm:px-0 lg:max-w-none lg:grid-cols-[60%_40%] lg:px-0">
<div className="relative hidden h-full flex-col bg-muted p-10 text-white lg:flex dark:border-r"> <div
<div className="absolute inset-0 bg-zinc-900" /> className="relative hidden h-full flex-col p-10 text-white lg:flex dark:border-r bg-cover bg-center"
<Link style={{ backgroundImage: "url('/assets/cover-login.jpg')" }}
href={home()} >
className="relative z-20 flex items-center text-lg font-medium" <div className="absolute inset-0 bg-zinc-900/20" />
>
<AppLogoIcon className="mr-2 size-8 fill-current text-white" />
{name}
</Link>
</div> </div>
<div className="w-full lg:p-8"> <div className="w-full lg:p-8">
<div className="mx-auto flex w-full flex-col justify-center space-y-6 sm:w-[350px]"> <div className="mx-auto flex w-full flex-col justify-center space-y-6 sm:w-[350px]">
<Link <Link
href={home()} href={home()}
className="relative z-20 flex items-center justify-center lg:hidden" className="relative z-20 flex items-center justify-center"
> >
<AppLogoIcon className="h-10 fill-current text-black sm:h-12" /> <AppLogoIcon className="h-10 fill-current text-black sm:h-12" />
</Link> </Link>

49
resources/js/pages/auth/login.tsx
View File

@ -1,30 +1,23 @@
import { Form, Head } from '@inertiajs/react'; import { Form, Head } from '@inertiajs/react';
import InputError from '@/components/input-error'; import InputError from '@/components/input-error';
import PasswordInput from '@/components/password-input'; import PasswordInput from '@/components/password-input';
import TextLink from '@/components/text-link';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { Checkbox } from '@/components/ui/checkbox'; import { Checkbox } from '@/components/ui/checkbox';
import { Input } from '@/components/ui/input'; import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label'; import { Label } from '@/components/ui/label';
import { Spinner } from '@/components/ui/spinner'; import { Spinner } from '@/components/ui/spinner';
import { register } from '@/routes';
import { store } from '@/routes/login'; import { store } from '@/routes/login';
import { request } from '@/routes/password';
type Props = { type Props = {
status?: string; status?: string;
canResetPassword: boolean;
canRegister: boolean;
}; };
export default function Login({ export default function Login({
status, status,
canResetPassword,
canRegister,
}: Props) { }: Props) {
return ( return (
<> <>
<Head title="Log in" /> <Head title="Masuk" />
<Form <Form
{...store.form()} {...store.form()}
@ -35,7 +28,7 @@ export default function Login({
<> <>
<div className="grid gap-6"> <div className="grid gap-6">
<div className="grid gap-2"> <div className="grid gap-2">
<Label htmlFor="email">Email address</Label> <Label htmlFor="email">Alamat Surel</Label>
<Input <Input
id="email" id="email"
type="email" type="email"
@ -43,32 +36,23 @@ export default function Login({
required required
autoFocus autoFocus
tabIndex={1} tabIndex={1}
autoComplete="email" autoComplete="off"
placeholder="email@example.com" placeholder="johndoe@example.com"
/> />
<InputError message={errors.email} /> <InputError message={errors.email} />
</div> </div>
<div className="grid gap-2"> <div className="grid gap-2">
<div className="flex items-center"> <div className="flex items-center">
<Label htmlFor="password">Password</Label> <Label htmlFor="password">Kata Sandi</Label>
{canResetPassword && (
<TextLink
href={request()}
className="ml-auto text-sm"
tabIndex={5}
>
Forgot password?
</TextLink>
)}
</div> </div>
<PasswordInput <PasswordInput
id="password" id="password"
name="password" name="password"
required required
tabIndex={2} tabIndex={2}
autoComplete="current-password" autoComplete="off"
placeholder="Password" placeholder="********"
/> />
<InputError message={errors.password} /> <InputError message={errors.password} />
</div> </div>
@ -79,7 +63,7 @@ export default function Login({
name="remember" name="remember"
tabIndex={3} tabIndex={3}
/> />
<Label htmlFor="remember">Remember me</Label> <Label htmlFor="remember">Ingat saya</Label>
</div> </div>
<Button <Button
@ -90,18 +74,9 @@ export default function Login({
data-test="login-button" data-test="login-button"
> >
{processing && <Spinner />} {processing && <Spinner />}
Log in Masuk
</Button> </Button>
</div> </div>
{canRegister && (
<div className="text-center text-sm text-muted-foreground">
Don't have an account?{' '}
<TextLink href={register()} tabIndex={5}>
Sign up
</TextLink>
</div>
)}
</> </>
)} )}
</Form> </Form>
@ -116,6 +91,6 @@ export default function Login({
} }
Login.layout = { Login.layout = {
title: 'Log in to your account', title: 'Masuk ke akun Anda',
description: 'Enter your email and password below to log in', description: 'Masukkan alamat surel atau nama pengguna dan kata sandi Anda di bawah untuk masuk.',
}; };