make translate for login, register pages

2025-12-10 16:39:13 +07:00
parent d9c26b079d
commit f281c13f87
31 changed files with 830 additions and 103 deletions
@@ -0,0 +1,63 @@
+import { Metadata } from 'next';
+import styles from '@/app/styles/login.module.scss'
+import LogoIcon from '@/app/ui/logo-icon';
+import Link from 'next/link';
+import LoginForm from '@/app/ui/login-form';
+import LanguageSwitcher from '@/app/components/LanguageSwitcher';
+import { useTranslations } from 'next-intl';
+
+export const metadata: Metadata = {
+	title: 'Login',
+};
+
+export default function Page() {
+	const t = useTranslations('Login-register-form');
+
+	return (
+		<div className={`${styles['login-container-wrapper']}`}>
+			<div className={`${styles['login-container-language']}`}>
+				<LanguageSwitcher />
+			</div>
+			<div className={`${styles['login-container']}`}>
+				<div className={`${styles['logo']}`}>
+					<LogoIcon />
+					<h1>NO COPY</h1>
+					<p>
+						{t('copyright-protection')}
+					</p>
+				</div>
+				<LoginForm />
+				<div className="divider">
+					<span>
+						{t('or-log-in-via')}
+					</span>
+				</div>
+				<div className={`${styles['register-link']}`}>
+					<p>{t('no-account')}?
+						<Link href="register"> {t('register')}</Link>
+					</p>
+				</div>
+				<div className={`${styles['features']}`}>
+					<div className={`${styles['feature']}`}>
+						<svg className={`${styles['feature-icon']}`} viewBox="0 0 24 24" fill="currentColor">
+							<path d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+						</svg>
+						{t('protecting-watermark')}
+					</div>
+					<div className={`${styles['feature']}`}>
+						<svg className={`${styles['feature-icon']}`} viewBox="0 0 24 24" fill="currentColor">
+							<path d="M13 10V3L4 14h7v7l9-11h-7z"></path>
+						</svg>
+						{t('monitoring-violations')}
+					</div>
+					<div className={`${styles['feature']}`}>
+						<svg className={`${styles['feature-icon']}`} viewBox="0 0 24 24" fill="currentColor">
+							<path d="M12 1L3 5v6c0 5.55 3.84 9.74 9 11 5.16-1.26 9-5.45 9-11V5l-9-4z"></path>
+						</svg>
+						{t('safe-storage')}
+					</div>
+				</div>
+			</div>
+		</div>
+	);
+}