Skip to content

Commit

Permalink
Feature/#76 new registration layout (#83)
Browse files Browse the repository at this point in the history 
* new registration layout

* styles fix

* remove additional files
  • Loading branch information
@Art-mimiron
Art-mimiron authored Apr 7, 2021
1 parent 0b890c8 commit fc9dbc3
Show file tree
Hide file tree
Showing 6 changed files with 451 additions and 38 deletions.
134 changes: 99 additions & 35 deletions OutOfSchool/OutOfSchool.IdentityServer/Views/Auth/Register.cshtml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,40 +3,104 @@
@{
Layout = "_Layout";
}
<form class="login__wrapper" asp-controller="Auth" asp-action="Register" method="post">
<input type="hidden" asp-for="ReturnUrl" />
<div>
<label class="login__label">Username</label>
<input class="login__input" asp-for="Username" />
<span asp-validation-for="Username"></span>
<div class="registration">
<div class="registration_wrapper">
<h3 class="registration_title">ЗАРЕЄСТРУВАТИСЯ</h3>
<h5 class="registration_subtitle">Щоб мати змогу подавати заявки у гуртки або стати надавачем послуг</h5>
<div class="registration_social">
<button class="registration_button">
<img src="/icons/fb.png" alt="facebook">
</button>
<button class="registration_button">
<img src="/icons/google.png" alt="google">
</button>
</div>
<div>
<label class="login__label">Password</label>
<input class="login__input" asp-for="Password" />
<span asp-validation-for="Password"></span>
<div class="registration_option">або заповніть форму</div>
<form action="" class="registration_form">
<ul class="registration_list">
<li class="registration_item">
<label class="registration_label">
Зареєструватися як<span class="registration_star">*</span>
</label>
<div class="registration_as">
<button class="registration_type registration_type-active">
<div class="registration_icon registration_icon-person">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.99984 5.99984C7.47317 5.99984 8.6665 4.8065 8.6665 3.33317C8.6665 1.85984 7.47317 0.666504 5.99984 0.666504C4.5265 0.666504 3.33317 1.85984 3.33317 3.33317C3.33317 4.8065 4.5265 5.99984 5.99984 5.99984ZM5.99984 7.33317C4.21984 7.33317 0.666504 8.2265 0.666504 9.99984V11.3332H11.3332V9.99984C11.3332 8.2265 7.77984 7.33317 5.99984 7.33317Z" fill="#272425"/>
</svg>
</div>
Користувач
</button>
<button class="registration_type">
<div class="registration_icon registration_icon-provider">
<svg width="13" height="15" viewBox="0 0 13 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.66683 6.6665V11.3332H3.66683V6.6665H1.66683ZM5.66683 6.6665V11.3332H7.66683V6.6665H5.66683ZM0.333496 14.6665H13.0002V12.6665H0.333496V14.6665ZM9.66683 6.6665V11.3332H11.6668V6.6665H9.66683ZM6.66683 0.666504L0.333496 3.99984V5.33317H13.0002V3.99984L6.66683 0.666504Z" fill="#272425"/>
</svg>
</div>
Надавач послуг
</button>
<div class="registration_divider"></div>
</div>
</li>
<li class="registration_item">
<label class="registration_label" for="last_name">Прізвище<span class="registration_star">*</span></label>
<input class="registration_input" type="text" name="last_name" id="last_name">
</li>
<li class="registration_item">
<label class="registration_label" for="first_name">Ім’я<span class="registration_star">*</span></label>
<input class="registration_input" type="text" name="first_name" id="first_name">
</li>
<li class="registration_item">
<label class="registration_label" for="middle_name">По-батькові</label>
<input class="registration_input" type="text" name="middle_name" id="middle_name">
</li>
<li class="registration_item">
<label class="registration_label" for="phone_number">Телефон<span class="registration_star">*</span></label>
<div class="registration_phone">
<div class="registration_phone-code">+38</div>
<input class="registration_input" type="text" name="phone_number" id="phone_number">
</div>
</li>
<li class="registration_item">
<label class="registration_label" for="user_mail">Емейл<span class="registration_star">*</span></label>
<input class="registration_input" type="email" name="user_main" id="user_mail">
</li>
<li class="registration_item registration_item-password">
<label class="registration_label" for="password">Пароль<span class="registration_star">*</span></label>
<input class="registration_input registration_input-password" type="password" name="password" id="password">
<button class="registration_privacy">
<img src="//icons/ic_eye.svg" alt="eye" class="registration_eye">
</button>
</li>
<li class="registration_item registration_item-tip">
<div class="registration_tip">
Пароль має містити мінімум 6 символів
</div>
</li>
<li class="registration_item">
<label class="registration_label" for="repeat_password">Повторити пароль<span class="registration_star">*</span></label>
<input class="registration_input" type="password" name="repeat_password" id="repeat_password">
<button class="registration_privacy">
<img src="/icons/ic_eye.svg" alt="eye" class="registration_eye">
</button>
</li>
<li class="registration_item registration_item-maturity">
<input type="checkbox" id="maturity" name="maturity">
<label for="maturity">Мені виповнилося 18 років</label>
</li>
<li class="registration_item registration_item-accept">
Реєструючись я погоджуюсь з
<a href="#" class="registration_link">Правилами користування</a>
та надаю згоду на обробку персональних даних
</li>
<li class="registration_item">
<button class="registration_submit">ЗАРЕЄСТРУВАТИСЯ</button>
</li>
</ul>
</form>
<div class="registration_login">
Уже зареєстровані?
<a href="#" class="registration_link">Увійти</a>
</div>
<div>
<label class="login__label">Confirm Password</label>
<input class="login__input" asp-for="ConfirmPassword" />
<span asp-validation-for="ConfirmPassword"></span>
</div>
<div>
<label class="login__label">PhoneNumber</label>
<input class="login__input" asp-for="PhoneNumber" />
<span asp-validation-for="PhoneNumber"></span>
</div>
<div>
<label class="login__label">Email</label>
<input class="login__input" asp-for="Email" />
<span asp-validation-for="Email"></span>
</div>
<div asp-validation-summary="ModelOnly"></div>
<div>
<button class="login__button" type="submit" name="Provider" >Зареєструватись як надавач послуг</button>
<button class="login__button" type="submit" name="Parent" >Зареєструватись як parent?</button>
</div>
</form>
<div class="login__wrapper">
<a class="login__link" asp-controller="Auth" asp-action="Login"
asp-route-returnUrl="@Model.ReturnUrl">Back to Login</a>
</div>
</div>
</div>
Loading

0 comments on commit fc9dbc3

Please sign in to comment.