From 07f6ee911fffb452df7ffc40e720b60e20655d71 Mon Sep 17 00:00:00 2001 From: Alliana <56180684+Allianaab2m@users.noreply.github.com> Date: Sun, 18 Aug 2024 18:17:02 +0900 Subject: [PATCH 1/8] feat: add LoginForm component --- app/components/LoginForm.tsx | 33 +++++++++++++++++++++++++++++++++ i18n/locales/en_US.json | 8 +++++++- i18n/locales/ja_JP.json | 8 +++++++- 3 files changed, 47 insertions(+), 2 deletions(-) create mode 100644 app/components/LoginForm.tsx diff --git a/app/components/LoginForm.tsx b/app/components/LoginForm.tsx new file mode 100644 index 0000000..f919885 --- /dev/null +++ b/app/components/LoginForm.tsx @@ -0,0 +1,33 @@ +import { + Box, + Button, + Flex, + Heading, + Link, + Text, + TextField +} from "@radix-ui/themes"; +import { useTranslation } from "react-i18next"; + +export default function LoginForm() { + const { t } = useTranslation(); + + return ( + + {t("login")} + + {t("idAndMailAddress")} + + + + {t("password")} + + + + + {t("register")} + {t("forgotPassword")} + + + ); +} diff --git a/i18n/locales/en_US.json b/i18n/locales/en_US.json index 081c6a6..72a9f63 100644 --- a/i18n/locales/en_US.json +++ b/i18n/locales/en_US.json @@ -1,4 +1,10 @@ { "appName": "Pulsate", - "welcome": "Welcome" + "welcome": "Welcome", + "login": "Login", + "id": "ID", + "idAndMailAddress": "ID / Email Address", + "password": "Password", + "register": "Register", + "forgotPassword": "Forgot password..." } diff --git a/i18n/locales/ja_JP.json b/i18n/locales/ja_JP.json index 8caa90a..f350a3f 100644 --- a/i18n/locales/ja_JP.json +++ b/i18n/locales/ja_JP.json @@ -1,4 +1,10 @@ { "appName": "Pulsate", - "welcome": "ようこそ" + "welcome": "ようこそ", + "login": "ログイン", + "id": "ID", + "idAndMailAddress": "ID / メールアドレス", + "password": "パスワード", + "register": "新規登録", + "forgotPassword": "パスワードを忘れたら..." } From 57173f8c02a97d746a9b344327602d0f732c5984 Mon Sep 17 00:00:00 2001 From: Alliana <56180684+Allianaab2m@users.noreply.github.com> Date: Sun, 18 Aug 2024 18:17:17 +0900 Subject: [PATCH 2/8] feat: add LoginForm component story --- app/components/LoginForm.stories.tsx | 11 +++++++++++ 1 file changed, 11 insertions(+) create mode 100644 app/components/LoginForm.stories.tsx diff --git a/app/components/LoginForm.stories.tsx b/app/components/LoginForm.stories.tsx new file mode 100644 index 0000000..483c2fb --- /dev/null +++ b/app/components/LoginForm.stories.tsx @@ -0,0 +1,11 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import LoginForm from "./LoginForm"; + +export default { + title: "LoginForm", + component: LoginForm +} satisfies Meta; + +type Story = StoryObj; + +export const Default: Story = {}; From f3f259342784133a247c97f708ffaf21543fe27d Mon Sep 17 00:00:00 2001 From: Alliana <56180684+Allianaab2m@users.noreply.github.com> Date: Sun, 18 Aug 2024 19:13:34 +0900 Subject: [PATCH 3/8] fix: change login button size --- app/components/LoginForm.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/components/LoginForm.tsx b/app/components/LoginForm.tsx index f919885..9f8d37c 100644 --- a/app/components/LoginForm.tsx +++ b/app/components/LoginForm.tsx @@ -24,7 +24,7 @@ export default function LoginForm() { - + {t("register")} {t("forgotPassword")} From d52c8b9fd399cec97bfcdf674022f4ef7dac32e3 Mon Sep 17 00:00:00 2001 From: Alliana <56180684+Allianaab2m@users.noreply.github.com> Date: Sun, 18 Aug 2024 19:13:51 +0900 Subject: [PATCH 4/8] feat: add Login page --- app/routes/login.tsx | 117 +++++++++++++++---------------------------- 1 file changed, 41 insertions(+), 76 deletions(-) diff --git a/app/routes/login.tsx b/app/routes/login.tsx index 0523502..f09109f 100644 --- a/app/routes/login.tsx +++ b/app/routes/login.tsx @@ -1,86 +1,51 @@ -import { - Box, - Button, - Card, - Flex, - Link, - TabNav, - Text, - TextField -} from "@radix-ui/themes"; +import { Box, Flex, Link, Text } from "@radix-ui/themes"; +import { version } from "package.json"; +import { useTranslation } from "react-i18next"; +import LoginForm from "~/components/LoginForm"; export default function LoginPage() { + const { t } = useTranslation(); + return ( - - + - + + + + {t("appName")} v.{version} + + {t("aboutPulsate")} + - - ログイン - - - - ID/メールアドレス - - - - - - パスワード - - - - - - 新規登録 - - + {t("sourceCode")} + -
- - Pulsate v0.1.0 - - Pulsateについて - - - ソースコード - - -
- + ); } From 06ee3a2131e47ce862661db7394a7d1c31c63408 Mon Sep 17 00:00:00 2001 From: Alliana <56180684+Allianaab2m@users.noreply.github.com> Date: Sun, 18 Aug 2024 19:14:10 +0900 Subject: [PATCH 5/8] chore: add i18n --- i18n/locales/en_US.json | 4 +++- i18n/locales/ja_JP.json | 4 +++- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/i18n/locales/en_US.json b/i18n/locales/en_US.json index 72a9f63..885cd98 100644 --- a/i18n/locales/en_US.json +++ b/i18n/locales/en_US.json @@ -6,5 +6,7 @@ "idAndMailAddress": "ID / Email Address", "password": "Password", "register": "Register", - "forgotPassword": "Forgot password..." + "forgotPassword": "Forgot password...", + "aboutPulsate": "About Pulsate", + "sourceCode": "Source code" } diff --git a/i18n/locales/ja_JP.json b/i18n/locales/ja_JP.json index f350a3f..d03601e 100644 --- a/i18n/locales/ja_JP.json +++ b/i18n/locales/ja_JP.json @@ -6,5 +6,7 @@ "idAndMailAddress": "ID / メールアドレス", "password": "パスワード", "register": "新規登録", - "forgotPassword": "パスワードを忘れたら..." + "forgotPassword": "パスワードを忘れたら...", + "aboutPulsate": "Pulsateについて", + "sourceCode": "ソースコード" } From 50b922f345d0882cd18529c2c90d70be02ed993c Mon Sep 17 00:00:00 2001 From: Alliana <56180684+Allianaab2m@users.noreply.github.com> Date: Sun, 18 Aug 2024 19:14:29 +0900 Subject: [PATCH 6/8] fix: remove unnecessary margin from User Agent --- app/root.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/root.tsx b/app/root.tsx index 38d0aeb..6d04338 100644 --- a/app/root.tsx +++ b/app/root.tsx @@ -21,7 +21,7 @@ export function Layout({ children }: { children: ReactNode }) { - + {children} From a744d19553411b06935ca241c993d3af164c961a Mon Sep 17 00:00:00 2001 From: Alliana <56180684+Allianaab2m@users.noreply.github.com> Date: Sun, 18 Aug 2024 19:16:37 +0900 Subject: [PATCH 7/8] fix: add margin top between login button and text area --- app/components/LoginForm.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/components/LoginForm.tsx b/app/components/LoginForm.tsx index 9f8d37c..6b108d5 100644 --- a/app/components/LoginForm.tsx +++ b/app/components/LoginForm.tsx @@ -23,7 +23,7 @@ export default function LoginForm() { {t("password")} - + {t("register")} {t("forgotPassword")} From 6bfe22b5225657dc31785c0f3bf02bf025ec1297 Mon Sep 17 00:00:00 2001 From: Alliana <56180684+Allianaab2m@users.noreply.github.com> Date: Sun, 18 Aug 2024 19:28:30 +0900 Subject: [PATCH 8/8] fix: underline in Link --- app/routes/login.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/app/routes/login.tsx b/app/routes/login.tsx index f09109f..54e641e 100644 --- a/app/routes/login.tsx +++ b/app/routes/login.tsx @@ -41,7 +41,11 @@ export default function LoginPage() { {t("aboutPulsate")} {t("sourceCode")}