From 21d37d19e59ce1bb82450c8871e805d8b2b49656 Mon Sep 17 00:00:00 2001
From: Przemek <przemek.wiktorski@escola.pl>
Date: Mon, 4 Mar 2024 16:20:13 +0100
Subject: [PATCH] static

---
 .../atoms/ProgressBar/ProgressBar.tsx         |  3 +-
 .../organisms/MyProfileForm/MyProfileForm.tsx | 31 ++++++++++++-------
 2 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/src/components/atoms/ProgressBar/ProgressBar.tsx b/src/components/atoms/ProgressBar/ProgressBar.tsx
index a6597c8e..1067c162 100644
--- a/src/components/atoms/ProgressBar/ProgressBar.tsx
+++ b/src/components/atoms/ProgressBar/ProgressBar.tsx
@@ -36,7 +36,7 @@ const StyledDiv = styled.div`
     }
 
     .percentage-value {
-      font-size: 14px;
+      font-size: 13px;
       margin-left: auto;
       height: 22px;
       display: flex;
@@ -48,7 +48,6 @@ const StyledDiv = styled.div`
   }
 
   .progress-container {
-
     &:not(:last-child) {
       margin-bottom: 6px;
     }
diff --git a/src/components/organisms/MyProfileForm/MyProfileForm.tsx b/src/components/organisms/MyProfileForm/MyProfileForm.tsx
index 4a3a4a37..9594bfad 100644
--- a/src/components/organisms/MyProfileForm/MyProfileForm.tsx
+++ b/src/components/organisms/MyProfileForm/MyProfileForm.tsx
@@ -13,8 +13,6 @@ import { Input, Button, Text, Checkbox, TextArea } from "../../../";
 import { ExtendableStyledComponent } from "types/component";
 
 const StyledFormHeader = styled.div<{ mobile: boolean }>`
-  text-align: center;
-
   h2,
   h3,
   h4 {
@@ -26,6 +24,15 @@ const StyledFormHeader = styled.div<{ mobile: boolean }>`
     text-align: left;
   }
   .upload {
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+
+    min-width: 250px;
+    .wrapper {
+      margin-right: 20px;
+      width: 40%;
+    }
   }
 `;
 
@@ -37,7 +44,7 @@ const StyledDiv = styled.div<{ mobile: boolean }>`
   flex-direction: column;
   flex-wrap: wrap;
   justify-content: center;
-  align-items: center;
+  align-items: flex-start;
   align-content: center;
   .lms-checkbox {
     margin: 20px 0;
@@ -168,6 +175,15 @@ export const MyProfileForm: React.FC<Props> = ({
   return (
     <>
       <StyledDiv className="wellms-component" mobile={mobile}>
+        <StyledFormHeader className="wellms-component" mobile={mobile}>
+          <Text size="18">{t("MyProfileForm.Avatar")}</Text>
+          <Upload
+            path={initialValues.path_avatar}
+            url={initialValues.avatar}
+            accept="image/*"
+            onChange={onAvatarChange}
+          />
+        </StyledFormHeader>
         <Formik
           enableReinitialize
           initialValues={initialValues}
@@ -343,15 +359,6 @@ export const MyProfileForm: React.FC<Props> = ({
             </form>
           )}
         </Formik>{" "}
-        <StyledFormHeader className="wellms-component" mobile={mobile}>
-          <Text size="18">{t("MyProfileForm.Avatar")}</Text>
-          <Upload
-            path={initialValues.path_avatar}
-            url={initialValues.avatar}
-            accept="image/*"
-            onChange={onAvatarChange}
-          />
-        </StyledFormHeader>
       </StyledDiv>
     </>
   );