From 7b1f172e22f63bd3e85d9a72d5110f49246be003 Mon Sep 17 00:00:00 2001
From: Darya Umrikhina <darya.umrihina@onlyoffice.com>
Date: Thu, 15 Aug 2024 02:42:27 +0400
Subject: [PATCH] Login:Src:Components: change styles

---
 .../CreateUserForm/CreateUserForm.styled.tsx  |  1 +
 .../GreetingCreateUserContainer.styled.tsx    |  1 -
 .../src/components/Wizard/Wizard.styled.tsx   | 41 -------------------
 .../WizardForm/WizardForm.styled.ts           | 20 ++++-----
 .../login/src/components/WizardForm/index.tsx |  6 +--
 5 files changed, 11 insertions(+), 58 deletions(-)

diff --git a/packages/login/src/components/CreateUserForm/CreateUserForm.styled.tsx b/packages/login/src/components/CreateUserForm/CreateUserForm.styled.tsx
index 98352f3925..40bee6fd1e 100644
--- a/packages/login/src/components/CreateUserForm/CreateUserForm.styled.tsx
+++ b/packages/login/src/components/CreateUserForm/CreateUserForm.styled.tsx
@@ -38,6 +38,7 @@ export const RegisterContainer = styled.div<{
   width: 100%;
 
   .or-label {
+    color: ${(props) => props.theme.invitePage.textColor};
     margin: 0 8px;
   }
 
diff --git a/packages/login/src/components/GreetingContainer/GreetingCreateUserContainer/GreetingCreateUserContainer.styled.tsx b/packages/login/src/components/GreetingContainer/GreetingCreateUserContainer/GreetingCreateUserContainer.styled.tsx
index dc23457025..2bd912e080 100644
--- a/packages/login/src/components/GreetingContainer/GreetingCreateUserContainer/GreetingCreateUserContainer.styled.tsx
+++ b/packages/login/src/components/GreetingContainer/GreetingCreateUserContainer/GreetingCreateUserContainer.styled.tsx
@@ -33,7 +33,6 @@ const TABLET_WIDTH = 480;
 export const GreetingContainer = styled.div`
   display: flex;
   flex-direction: column;
-  align-items: left;
   height: 100%;
   width: ${DESKTOP_WIDTH}px;
 
diff --git a/packages/login/src/components/Wizard/Wizard.styled.tsx b/packages/login/src/components/Wizard/Wizard.styled.tsx
index f156cc8d65..6aff48ff5b 100644
--- a/packages/login/src/components/Wizard/Wizard.styled.tsx
+++ b/packages/login/src/components/Wizard/Wizard.styled.tsx
@@ -76,47 +76,6 @@ export const WizardFormWrapper = styled.div<{ bgPattern: string }>`
     }
   }
 
-  .invitation-info-container {
-    margin-bottom: 16px;
-    .sign-in-container {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      position: relative;
-
-      margin-bottom: 16px;
-      .back-title {
-        position: absolute;
-        text-overflow: ellipsis;
-        overflow: hidden;
-
-        ${(props) =>
-          props.theme.interfaceDirection === "rtl"
-            ? css`
-                right: 0;
-              `
-            : css`
-                left: 0;
-              `};
-
-        display: flex;
-        gap: 4px;
-
-        svg {
-          ${(props) =>
-            props.theme.interfaceDirection === "rtl" &&
-            " transform: rotate(180deg)"};
-        }
-
-        p {
-          color: ${(props) => props.theme.login.backTitle.color};
-        }
-
-        p:hover {
-          cursor: pointer;
-        }
-      }
-    }
   }
 `;
 
diff --git a/packages/login/src/components/WizardForm/WizardForm.styled.ts b/packages/login/src/components/WizardForm/WizardForm.styled.ts
index 822c20fe24..401663c2e2 100644
--- a/packages/login/src/components/WizardForm/WizardForm.styled.ts
+++ b/packages/login/src/components/WizardForm/WizardForm.styled.ts
@@ -110,22 +110,19 @@ export const StyledInfo = styled.div`
 
   margin-bottom: 4px;
 
+  .text {
+    color: ${(props) => props.theme.client.wizard.textColor};
+  }
+
   .machine-name {
     padding-bottom: 4px;
     padding-top: 4px;
-    padding-left: 8px;
-    ${({ theme }) =>
-      theme.interfaceDirection === "rtl"
-        ? `padding-right: 8px;`
-        : `padding-left: 8px;`}
+    padding-inline-start: 8px;
     line-height: 20px;
   }
 
   .combo-button {
-    ${({ theme }) =>
-      theme.interfaceDirection === "rtl"
-        ? `padding-right: 8px;`
-        : `padding-left: 8px;`}
+    padding-inline-start: 8px;
   }
 
   .wrapper__language-selector {
@@ -156,9 +153,6 @@ export const StyledAcceptTerms = styled.div`
   padding-bottom: 24px;
 
   .wizard-checkbox svg {
-    ${({ theme }) =>
-      theme.interfaceDirection === "rtl"
-        ? `margin-left: 8px;`
-        : `margin-right: 8px;`}
+    margin-inline-end: 8px;
   }
 `;
diff --git a/packages/login/src/components/WizardForm/index.tsx b/packages/login/src/components/WizardForm/index.tsx
index 84c43a0262..221f212632 100644
--- a/packages/login/src/components/WizardForm/index.tsx
+++ b/packages/login/src/components/WizardForm/index.tsx
@@ -411,7 +411,7 @@ function WizardForm(props: WizardFormProps) {
       )}
 
       <StyledInfo>
-        <Text color="#A3A9AE" fontWeight={400}>
+        <Text className="text" fontWeight={400}>
           {t("Common:Domain")}
         </Text>
         <Text fontWeight={600} className="machine-name">
@@ -420,7 +420,7 @@ function WizardForm(props: WizardFormProps) {
       </StyledInfo>
 
       <StyledInfo>
-        <Text color="#A3A9AE" fontWeight={400}>
+        <Text className="text" fontWeight={400}>
           {t("Common:Language")}
         </Text>
         <div className="wrapper__language-selector">
@@ -449,7 +449,7 @@ function WizardForm(props: WizardFormProps) {
       </StyledInfo>
 
       <StyledInfo>
-        <Text color="#A3A9AE" fontWeight={400}>
+        <Text className="text" fontWeight={400}>
           {t("Timezone")}
         </Text>
         <ComboBox