From e40be008baf4f576cff30d86e6d9de3526b3887e Mon Sep 17 00:00:00 2001
From: Arik Chakma <arikchangma@gmail.com>
Date: Sat, 1 Apr 2023 04:32:12 +0600
Subject: [PATCH] chore: update profile page

---
 src/components/Setting/ChangePassword.astro |  9 +++---
 src/components/Setting/UpdateProfile.astro  | 35 +++++++++++++++++++++
 src/pages/settings/change-password.astro    |  2 +-
 src/pages/settings/profile.astro            | 10 ++++++
 4 files changed, 51 insertions(+), 5 deletions(-)
 create mode 100644 src/components/Setting/UpdateProfile.astro
 create mode 100644 src/pages/settings/profile.astro

diff --git a/src/components/Setting/ChangePassword.astro b/src/components/Setting/ChangePassword.astro
index 9c2983e65..0e6a097fb 100644
--- a/src/components/Setting/ChangePassword.astro
+++ b/src/components/Setting/ChangePassword.astro
@@ -3,7 +3,7 @@
   <p class='mt-2'>Manage settings for your account passwords</p>
   <div class='mt-8 space-y-4'>
     <div class='flex w-full flex-col'>
-      <label for='current-password' class='text-sm text-slate-500'
+      <label for='current-password' class='text-sm leading-none text-slate-500'
         >Current Password</label
       >
       <input
@@ -16,7 +16,7 @@
       />
     </div>
     <div class='flex w-full flex-col'>
-      <label for='new-password' class='text-sm text-slate-500'
+      <label for='new-password' class='text-sm leading-none text-slate-500'
         >New Password</label
       >
       <input
@@ -29,8 +29,9 @@
       />
     </div>
     <div class='flex w-full flex-col'>
-      <label for='new-password-confirmation' class='text-sm text-slate-500'
-        >New Password Confirm</label
+      <label
+        for='new-password-confirmation'
+        class='text-sm leading-none text-slate-500'>New Password Confirm</label
       >
       <input
         type='password'
diff --git a/src/components/Setting/UpdateProfile.astro b/src/components/Setting/UpdateProfile.astro
new file mode 100644
index 000000000..992ed23ab
--- /dev/null
+++ b/src/components/Setting/UpdateProfile.astro
@@ -0,0 +1,35 @@
+<div>
+  <h2 class='text-3xl font-bold sm:text-4xl'>Update Profile</h2>
+  <p class='mt-2'>Manage settings for your roadmap.sh profile</p>
+  <div class='mt-8 space-y-4'>
+    <div class='flex w-full flex-col'>
+      <label for='name' class='text-sm text-slate-500 leading-none'>Name</label>
+      <input
+        type='text'
+        name='name'
+        id='name'
+        class='mt-2 block w-full appearance-none rounded-lg border border-gray-300 px-3 py-2 shadow-sm outline-none transition duration-150 ease-in-out placeholder:text-gray-400 focus:ring-2 focus:ring-black focus:ring-offset-1'
+        required
+        placeholder='Arik Chakma'
+      />
+    </div>
+    <div class='flex w-full flex-col'>
+      <label for='email' class='text-sm text-slate-500 leading-none'>Email</label>
+      <input
+        type='email'
+        name='email'
+        id='email'
+        class='mt-2 block w-full appearance-none rounded-lg border border-gray-300 px-3 py-2 shadow-sm outline-none transition duration-150 ease-in-out placeholder:text-gray-400 focus:ring-2 focus:ring-black focus:ring-offset-1'
+        required
+        placeholder='arik@roadmap.sh'
+      />
+    </div>
+
+    <button
+      class='!mt-5 inline-flex h-10 items-center justify-center rounded-lg border border-slate-300 bg-black p-2 px-4 text-sm font-medium text-white outline-none transition duration-150 ease-in-out focus:ring-2 focus:ring-black focus:ring-offset-1 disabled:opacity-60'
+      type='button'
+    >
+      Update
+    </button>
+  </div>
+</div>
diff --git a/src/pages/settings/change-password.astro b/src/pages/settings/change-password.astro
index 20f206280..c64205304 100644
--- a/src/pages/settings/change-password.astro
+++ b/src/pages/settings/change-password.astro
@@ -3,7 +3,7 @@ import ChangePassword from '../../components/Setting/ChangePassword.astro';
 import BaseLayout from '../../layouts/BaseLayout.astro';
 ---
 
-<BaseLayout title='' description=''>
+<BaseLayout title='Change Password' description=''>
   <div class='container py-10'>
     <ChangePassword />
   </div>
diff --git a/src/pages/settings/profile.astro b/src/pages/settings/profile.astro
new file mode 100644
index 000000000..1764a7bf0
--- /dev/null
+++ b/src/pages/settings/profile.astro
@@ -0,0 +1,10 @@
+---
+import UpdateProfile from '../../components/Setting/UpdateProfile.astro';
+import BaseLayout from '../../layouts/BaseLayout.astro';
+---
+
+<BaseLayout title='Update Profile'>
+  <div class='container py-10'>
+    <UpdateProfile />
+  </div>
+</BaseLayout>