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(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>
);
export default function AppLogoIcon() {
return <img src="/assets/logo.webp" alt="Logo" />;
}

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

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

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

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