diff --git a/public/locales/ru/translation.json b/public/locales/ru/translation.json index aefc7365..6f22296d 100644 --- a/public/locales/ru/translation.json +++ b/public/locales/ru/translation.json @@ -142,7 +142,7 @@ "No such account, please try to register": "Такой адрес не найден, попробуйте зарегистрироваться", "Nothing here yet": "Здесь пока ничего нет", "Nothing is here": "Здесь ничего нет", - "Or continue with social network": "Или продолжите через соцсеть", + "Or continue with social network": "Или войдите через соцсеть", "Or paste a link to an image": "Или вставьте ссылку на изображение", "Our regular contributor": "Наш постоянный автор", "Paragraphs": "Абзацев", diff --git a/src/components/Nav/AuthModal/AuthModal.module.scss b/src/components/Nav/AuthModal/AuthModal.module.scss index 075ef974..1d319c1d 100644 --- a/src/components/Nav/AuthModal/AuthModal.module.scss +++ b/src/components/Nav/AuthModal/AuthModal.module.scss @@ -105,20 +105,19 @@ .auth { display: flex; flex-direction: column; - justify-content: center; padding: $container-padding-x; @include media-breakpoint-up(lg) { - padding: 10rem 6rem; + padding: 4rem !important; } } .submitButton { display: block; font-weight: 700; + margin-top: 32px; padding: 1.6rem !important; width: 100%; - margin-top: 32px; } .authControl { @@ -129,12 +128,12 @@ .authLink { cursor: pointer; + @include font-size(1.6rem); } .authSubtitle { @include font-size(1.5rem); - - margin: 1em; + margin-bottom: 1em; } .authInfo { @@ -147,6 +146,21 @@ } } +.authForm { + display: flex; + flex: 1; + flex-direction: column; + justify-content: space-between; + + h4 { + font-weight: bold; + } +} + +.authFormForgetPassword { + justify-content: center; +} + .validationError { position: relative; top: -8px; diff --git a/src/components/Nav/AuthModal/ForgotPasswordForm.tsx b/src/components/Nav/AuthModal/ForgotPasswordForm.tsx index ca76687d..04e76b3d 100644 --- a/src/components/Nav/AuthModal/ForgotPasswordForm.tsx +++ b/src/components/Nav/AuthModal/ForgotPasswordForm.tsx @@ -66,57 +66,59 @@ export const ForgotPasswordForm = () => { } return ( -
-

{t('Forgot password?')}

-
{t('Everything is ok, please give us your email address')}
- -
-
    -
  • {submitError()}
  • -
-
-
- -
- {/*TODO: text*/} - {t("We can't find you, check email or")}{' '} - { - event.preventDefault() - changeSearchParam('mode', 'register') - }} - > - {t('register')} - -
-
- -
{validationErrors().email}
-
-
- handleEmailInput(event.currentTarget.value)} - /> - - -
- +
- -
-
- changeSearchParam('mode', 'login')}> - {t('I know the password')} - +

{t('Forgot password?')}

+
{t('Everything is ok, please give us your email address')}
+ +
+
    +
  • {submitError()}
  • +
+
+
+ +
+ {/*TODO: text*/} + {t("We can't find you, check email or")}{' '} + { + event.preventDefault() + changeSearchParam('mode', 'register') + }} + > + {t('register')} + +
+
+ +
{validationErrors().email}
+
+
+ handleEmailInput(event.currentTarget.value)} + /> + + +
+ +
+ +
+
+ changeSearchParam('mode', 'login')}> + {t('I know the password')} + +
) diff --git a/src/components/Nav/AuthModal/LoginForm.tsx b/src/components/Nav/AuthModal/LoginForm.tsx index d15c8700..40b234cc 100644 --- a/src/components/Nav/AuthModal/LoginForm.tsx +++ b/src/components/Nav/AuthModal/LoginForm.tsx @@ -115,82 +115,86 @@ export const LoginForm = () => { } return ( -
-

{t('Enter the Discours')}

- -
-
{submitError()}
- - - {t('Send link again')} - - -
-
- -
{t('Link sent, check your email')}
-
-
- handleEmailInput(event.currentTarget.value)} - /> - -
- -
{validationErrors().email}
-
- -
- handlePasswordInput(event.currentTarget.value)} - /> - - -
- - -
{validationErrors().password}
-
+
- -
-
- { - ev.preventDefault() - changeSearchParam('mode', 'forgot-password') - }} - > - {t('Forgot password?')} - +

{t('Enter the Discours')}

+ +
+
{submitError()}
+ + + {t('Send link again')} + + +
+
+ +
{t('Link sent, check your email')}
+
+
+ handleEmailInput(event.currentTarget.value)} + /> + +
+ +
{validationErrors().email}
+
+ +
+ handlePasswordInput(event.currentTarget.value)} + /> + + +
+ + +
{validationErrors().password}
+
+
+ +
+
- +
+ -
- changeSearchParam('mode', 'register')}> - {t('I have no account yet')} - +
+ changeSearchParam('mode', 'register')}> + {t('I have no account yet')} + +
) diff --git a/src/components/Nav/AuthModal/RegisterForm.tsx b/src/components/Nav/AuthModal/RegisterForm.tsx index 8a5cf7c3..a53f918e 100644 --- a/src/components/Nav/AuthModal/RegisterForm.tsx +++ b/src/components/Nav/AuthModal/RegisterForm.tsx @@ -134,87 +134,91 @@ export const RegisterForm = () => { return ( <> -
-

{t('Create account')}

- -
-
    -
  • {submitError()}
  • -
+ +
+

{t('Create account')}

+ +
+
    +
  • {submitError()}
  • +
+
+
+
+ handleNameInput(event.currentTarget.value)} + /> +
- -
- handleNameInput(event.currentTarget.value)} - /> - -
- -
{validationErrors().name}
-
-
- handleEmailInput(event.currentTarget.value)} - onBlur={handleEmailBlur} - /> - -
- -
{validationErrors().email}
-
- -
- {t("This email is already taken. If it's you")},{' '} - { - event.preventDefault() - changeSearchParam('mode', 'login') - }} - > - {t('enter')} - + +
{validationErrors().name}
+
+
+ handleEmailInput(event.currentTarget.value)} + onBlur={handleEmailBlur} + /> +
- -
- handlePasswordInput(event.currentTarget.value)} - /> - -
- -
- {validationErrors().password} + +
{validationErrors().email}
+
+ + + +
+ handlePasswordInput(event.currentTarget.value)} + /> +
- + +
+ {validationErrors().password} +
+
+ +
+ +
+
- -
+ - - -
- changeSearchParam('mode', 'login')}> - {t('I have an account')} - +
+ changeSearchParam('mode', 'login')}> + {t('I have an account')} + +
diff --git a/src/components/Nav/AuthModal/SocialProviders.module.scss b/src/components/Nav/AuthModal/SocialProviders.module.scss index 50c7965f..203ce97e 100644 --- a/src/components/Nav/AuthModal/SocialProviders.module.scss +++ b/src/components/Nav/AuthModal/SocialProviders.module.scss @@ -1,6 +1,6 @@ .container { - border-bottom: 1px solid #141414; - border-top: 1px solid #141414; + border-bottom: 1px solid #dfdfdf; + border-top: 1px solid #dfdfdf; margin-top: 1em; padding: 0.8em 0 1em; }