Исправлена страница входа и регистрации

src/pages/public/Login.jsx

@@ -11,7 +11,7 @@ import { AuthService } from '@api'
 
 import Logo from '@images/Logo'
 
-import '@styles/index.css'
+import '@styles/pages/login.less'
 
 const Login = memo(() => {
   const [showLoader, setShowLoader] = useState(false)
@@ -36,10 +36,10 @@ const Login = memo(() => {
       <div style={{ display: 'flex', flexDirection: 'column' }}>
         <Logo style={{ marginBottom: '10px' }} />
         <LoaderPortal show={showLoader}>
-          <Card bordered title={'Система мониторинга'} className={'shadow'} style={{ width: 350 }}>
+          <Card bordered title={'Вход в ЕЦП'} className={'shadow'} style={{ width: 350 }}>
             <Form onFinish={handleLogin}>
               <Form.Item name={'login'} rules={loginRules}>
-                <Input placeholder={'Пользователь'} prefix={<UserOutlined />} />
+                <Input placeholder={'Логин'} prefix={<UserOutlined />} />
               </Form.Item>
               <Form.Item name={'password'} rules={passwordRules}>
                 <Input.Password placeholder={'Пароль'} prefix={<LockOutlined />} />

src/pages/public/Register.jsx

@@ -8,7 +8,6 @@ import {
     EyeTwoTone
 } from '@ant-design/icons'
 
-import { AuthService } from '@api'
 import LoaderPortal from '@components/LoaderPortal'
 import { invokeWebApiWrapperAsync } from '@components/factory'
 import {
@@ -21,9 +20,12 @@ import {
     phoneRules
 } from '@utils/validationRules'
 import { withPermissions } from '@utils'
+import { AuthService } from '@api'
 
 import Logo from '@images/Logo'
 
+import '@styles/pages/login.less'
+
 const surnameRules = [...nameRules, { required: true, message: 'Пожалуйста, введите фамилию!' }]
 const regEmailRules = [{ required: true, message: 'Пожалуйста, введите email!' }, ...emailRules]
 const confirmPasswordRules = [
@@ -38,7 +40,6 @@ const confirmPasswordRules = [
     })
 ]
 
-const logoIcon = <Logo width={130} />
 const showPasswordIcon = visible => (visible ? <EyeTwoTone /> : <EyeInvisibleOutlined />)
 
 const createInput = (name, placeholder, rules, isPassword, dependencies) => (
@@ -66,10 +67,13 @@ export const Register = memo(() => {
     ), [navigate])
 
     return (
-        <LoaderPortal show={showLoader} className={'loader-container login_page shadow'}>
-            <Card title={'Система мониторинга'} className={'shadow'} bordered={true} style={{ width: 350 }} extra={logoIcon}>
+        <div className={'login_page shadow'}>
+            <div style={{ display: 'flex', flexDirection: 'column' }}>
+                <Logo style={{ marginBottom: '10px' }} />
+                <LoaderPortal show={showLoader}>
+                    <Card title={'Оставить заявку на регистрацию'} className={'shadow'} style={{ width: 350 }}>
                         <Form onFinish={handleRegister}>
-                    {createInput('login', 'Пользователь', [...loginRules, ...createLoginRules])}
+                            {createInput('login', 'Логин', [...loginRules, ...createLoginRules])}
                             {createInput('password', 'Пароль', [...passwordRules, ...createPasswordRules], true, null)}
                             {createInput('confirmPassword', 'Подтверждение пароля', confirmPasswordRules, true, ['password'])}
                             {createInput('name', 'Имя', nameRules)}
@@ -89,6 +93,8 @@ export const Register = memo(() => {
                         </Form>
                     </Card>
                 </LoaderPortal>
+            </div>
+        </div>
     )
 })
 

src/styles/pages/App.less

@@ -25,17 +25,6 @@ html {
     margin-left: 30px;
 }
 
-.login_page {
-    position: absolute;
-    height: 100%;
-    width: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    padding: 24px;
-    background-color: #9d9d9d;
-}
-
 .shadow{
     box-shadow: 1px 1px 4px #00000033;
 }

src/styles/pages/login.less

@@ -0,0 +1,20 @@
+.login-button {
+    width: 20%;
+    margin: auto;
+}
+
+.register-button {
+    width: 50%;
+    margin: auto;
+}
+
+.login_page {
+    position: absolute;
+    height: 100%;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 24px;
+    background-color: #232323;
+}

src/utils/validationRules.ts

@@ -15,7 +15,7 @@ export const createLoginRules: Readonly<Rule[]> = [_min1, {
 
 export const loginRules: Readonly<Rule[]> = [...createLoginRules, {
     required: true,
-    message: 'Пожалуйста, введите логин',
+    message: 'Пожалуйста, введите логин!',
 }]
 
 export const nameRules: Readonly<Rule[]> = [_min1, {