wip

src/svg/arr.svg

-<svg width="17" height="11" viewBox="0 0 17 11" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M10.0386 0.346239C10.4106 -0.0716678 11.0612 -0.117742 11.4918 0.243329L16.6433 4.56333C16.8644 4.74875 16.994 5.01657 16.9998 5.30012C17.0056 5.58368 16.8871 5.85629 16.6738 6.0501L11.5223 10.7301C11.1068 11.1075 10.4548 11.0866 10.066 10.6834C9.67714 10.2802 9.69869 9.64734 10.1141 9.26993L14.4293 5.34976L10.1446 1.7567C9.71403 1.39563 9.66656 0.764145 10.0386 0.346239Z" fill="white"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M0 5.5C0 4.94772 0.461282 4.5 1.0303 4.5H15.4545C16.0236 4.5 16.4848 4.94772 16.4848 5.5C16.4848 6.05228 16.0236 6.5 15.4545 6.5H1.0303C0.461282 6.5 0 6.05228 0 5.5Z" fill="white"/>
+<svg width="17" height="11" viewBox="0 0 17 11" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.0386 0.346239C10.4106 -0.0716678 11.0612 -0.117742 11.4918 0.243329L16.6433 4.56333C16.8644 4.74875 16.994 5.01657 16.9998 5.30012C17.0056 5.58368 16.8871 5.85629 16.6738 6.0501L11.5223 10.7301C11.1068 11.1075 10.4548 11.0866 10.066 10.6834C9.67714 10.2802 9.69869 9.64734 10.1141 9.26993L14.4293 5.34976L10.1446 1.7567C9.71403 1.39563 9.66656 0.764145 10.0386 0.346239Z" fill="currentColor"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 5.5C0 4.94772 0.461282 4.5 1.0303 4.5H15.4545C16.0236 4.5 16.4848 4.94772 16.4848 5.5C16.4848 6.05228 16.0236 6.5 15.4545 6.5H1.0303C0.461282 6.5 0 6.05228 0 5.5Z" fill="currentColor"/>
 </svg>

src/view/page/login/Login.jsx

@@ -16,19 +16,22 @@ export default D.declare('view.page.Login', () => {
         <div class="login-page__big-logo">
             <Logo width="660" height="300"/>
         </div>
-        {view.cmp.Switch({store: loginStore, key: 'active'}, {
-            enterPhone: [
-                <view.cmp.field.LabeledField label={'Login'} bind={loginStore.bind('phone')}/>,
-                <button
-                    onclick={()=>loginStore.set('active', 'enterCode')}
-                    disabled={_=>loginStore.equal('phoneValid', false, _)}
-                >Ага</button>
-            ],
-            enterCode: [
-                <button onClick={() => loginStore.set('active', 'enterPhone')}>Взат</button>,
-                <view.cmp.field.LabeledField label={'Code'}/>
-            ]
-        })}
-
+        <h1 className="login-page__title">Добро пожаловать в&nbsp;развивающую платформу Вкусвилл!</h1>
+        <form action="#" method="post" className="authorization-form">
+            {view.cmp.Switch({store: loginStore, key: 'active'}, {
+                enterPhone: [
+                    <view.cmp.field.LabeledField label={'Введите номер телефона, чтобы продолжить.'} bind={loginStore.bind('phone')}/>,
+                    <button
+                        class={"btn btn--primary authorization-form__btn"}
+                        onclick={()=>loginStore.set('active', 'enterCode')}
+                        disabled={_=>loginStore.equal('phoneValid', false, _)}
+                    >Ага</button>
+                ],
+                enterCode: [
+                    <button onClick={() => loginStore.set('active', 'enterPhone')}>Взат</button>,
+                    <view.cmp.field.LabeledField label={'Code'}/>
+                ]
+            })}
+        </form>
     </div>
 })

src/view/page/login/loginPage.scss

 .login-page {
 	flex-grow: 1;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
 	margin: 0 30px 30px;
+	padding: 54px;
 	background-image: url("/uploads/images/bg-leaves.svg");
 	background-repeat: no-repeat;
 	background-size: 100% auto;
 	background-position: bottom center;
 }
+
+.login-page__big-logo {
+	width: 300px;
+	height: 147px;
+}
+
+.login-page__big-logo svg {
+	display: block;
+	width: 100%;
+	height: 100%;
+}