submit button moved to mini components

ita-social-projects · Oct 9, 2024 · 4ab8232 · 4ab8232
1 parent bc53bcd
commit 4ab8232
Show file tree

Hide file tree

Showing 6 changed files with 47 additions and 64 deletions.
diff --git a/FrontEnd/src/components/MiniComponents/AdminSubmitButton.jsx b/FrontEnd/src/components/MiniComponents/AdminSubmitButton.jsx
@@ -0,0 +1,16 @@
+import classes from './AdminSubmitButton.module.css';
+
+const AdminSubmitButton = () => {
+    return (
+        <div className={classes['admin-submit__container']}>
+            <button
+                className={classes['admin-submit__button']}
+                type="submit"
+            >
+                Зберегти зміни
+            </button>
+          </div>
+    );
+};
+
+export default AdminSubmitButton;
diff --git a/FrontEnd/src/components/MiniComponents/AdminSubmitButton.module.css b/FrontEnd/src/components/MiniComponents/AdminSubmitButton.module.css
@@ -0,0 +1,26 @@
+.admin-submit__container {
+    margin-top: 16px;
+}
+
+.admin-submit__button {
+    display: flex;
+    border-radius: 4px;
+    border: 1px solid var(--main-button-color);
+    background: var(--main-button-color);
+    box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.04);
+    color: var(--light-button-text-color);
+    font-feature-settings: 'calt' off;
+    font-style: normal;
+    padding: 5px 15px 5px 15px;
+    font-family: var(--font-main);
+    font-size: 16px;
+    font-weight: 600;
+    line-height: 20px;
+    letter-spacing: -0.01em;
+    text-align: center;
+    cursor: pointer;
+}
+
+.admin-submit__button:active {
+    transform: translateY(2px);
+}
diff --git a/FrontEnd/src/pages/AdminPage/AdminProfile/AdminInfo.jsx b/FrontEnd/src/pages/AdminPage/AdminProfile/AdminInfo.jsx
@@ -2,6 +2,8 @@ import axios from 'axios';
 import { toast } from 'react-toastify';
 import { useForm } from 'react-hook-form';
 
+import AdminSubmitButton from '../../../components/MiniComponents/AdminSubmitButton';
+
 import classes from './AdminInfo.module.css';
 
 const AdminInfo = ({ user }) => {
@@ -126,14 +128,7 @@ const AdminInfo = ({ user }) => {
               {errors.surname && errors.surname.message}
             </div>
           </div>
-          <div className={classes['admin-submit__container']}>
-            <button
-                className={classes['admin-submit__button']}
-                type="submit"
-            >
-                Зберегти
-            </button>
-          </div>
+          <AdminSubmitButton />
         </div>
     </form>
     </div>

diff --git a/FrontEnd/src/pages/AdminPage/AdminProfile/AdminInfo.module.css b/FrontEnd/src/pages/AdminPage/AdminProfile/AdminInfo.module.css
@@ -6,7 +6,6 @@
 .admin-info-form__container {
     display: flex;
     flex-direction: column;
-    gap: 8px;
     flex-wrap: wrap;
 }
 
@@ -108,26 +107,3 @@
     font-weight: 400;
     line-height: 16px;
 }
-
-.admin-submit__button {
-    display: flex;
-    border-radius: 4px;
-    border: 1px solid var(--main-button-color);
-    background: var(--main-button-color);
-    box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.04);
-    color: var(--light-button-text-color);
-    font-feature-settings: 'calt' off;
-    font-style: normal;
-    padding: 5px 15px 5px 15px;
-    font-family: var(--font-main);
-    font-size: 16px;
-    font-weight: 600;
-    line-height: 20px;
-    letter-spacing: -0.01em;
-    text-align: center;
-    cursor: pointer;
-}
-
-.admin-submit__button:active {
-    transform: translateY(2px);
-}
diff --git a/FrontEnd/src/pages/AdminPage/AdminProfile/ChangeAdminPassword.jsx b/FrontEnd/src/pages/AdminPage/AdminProfile/ChangeAdminPassword.jsx
@@ -5,6 +5,7 @@ import { useForm } from 'react-hook-form';
 
 import PasswordField from '../../ProfilePage/FormComponents/FormFields/PasswordField';
 import Loader from '../../../components/Loader/Loader';
+import AdminSubmitButton from '../../../components/MiniComponents/AdminSubmitButton';
 
 import classes from './ChangeAdminPassword.module.css';
 
@@ -96,15 +97,7 @@ export default function ChangeAdminPassword(props) {
                 checkWith: 'newPassword',
               }}
             />
-
-          <div className={classes['admin-submit__container']}>
-            <button
-                className={classes['admin-submit__button']}
-                type="submit"
-            >
-                Змінити пароль
-            </button>
-          </div>
+          <AdminSubmitButton />
         </form>
       ) : (
         <Loader />

diff --git a/FrontEnd/src/pages/AdminPage/AdminProfile/ChangeAdminPassword.module.css b/FrontEnd/src/pages/AdminPage/AdminProfile/ChangeAdminPassword.module.css
@@ -12,26 +12,3 @@
     gap: 8px;
     align-items: center;
 }
-
-.admin-submit__button {
-    display: flex;
-    border-radius: 4px;
-    border: 1px solid #1F9A7C;
-    background: #1F9A7C;
-    box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.04);
-    color: white;
-    font-feature-settings: 'calt' off;
-    font-style: normal;
-    padding: 5px 15px 5px 15px;
-    font-family: var(--font-main);
-    font-size: 16px;
-    font-weight: 600;
-    line-height: 20px;
-    letter-spacing: -0.01em;
-    text-align: center;
-    cursor: pointer;
-}
-
-.admin-submit__button:active {
-    transform: translateY(2px);
-}