Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Modify the project views #6

Merged
merged 13 commits into from
May 30, 2024
Merged

Modify the project views #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
7fc2cb3
feat: add shared view layer
Nazg0r May 29, 2024
093133d
feat: add styles and images for views
Nazg0r May 29, 2024
e3dd83e
feat: separate footer metadate
Nazg0r May 29, 2024
cae819f
feat: add Home page markdown
Nazg0r May 29, 2024
56b7257
feat: add Testing page markdown
Nazg0r May 29, 2024
02b1ed2
feat: add Result page markdown
Nazg0r May 29, 2024
79e57f1
update: add extrnal images to Materials
Nazg0r May 29, 2024
0ec6a5b
delete: remove unused layout
Nazg0r May 29, 2024
d32ea5b
feat: add Login page markdown
Nazg0r May 29, 2024
41bca20
feat: add Register page markdown
Nazg0r May 29, 2024
bf51df8
feat: Add fonts for views
Nazg0r May 29, 2024
5600090
fix: fix logout and user display
Nazg0r May 29, 2024
0c08460
feat: marking current page
Nazg0r May 29, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
119 changes: 85 additions & 34 deletions src/MTRPZ4.UI/Areas/Identity/Pages/Account/Login.cshtml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,41 +1,92 @@
@page
@model LoginModel

@{
ViewData["Title"] = "Log in";
Layout = "~/Areas/Identity/Pages/_AuthLayout.cshtml";
}
<main class="main">
<section class="full-page">
<div class="full-page__background" aria-hidden="true">
<div class="full-page__decor">
<picture>
<source srcset="/Materials/decor-element-4.webp 1x" type="image/webp">
<img src="/Materials/decor-element-4.png" alt="" width="0" height="0" loading="lazy">
</picture>
</div>
<div class="full-page__decor">
<picture>
<source srcset="/Materials/decor-element-5.webp 1x" type="image/webp">
<img src="/Materials/decor-element-5.png" alt="" width="0" height="0" loading="lazy">
</picture>
</div>
<div class="full-page__decor">
<picture>
<source srcset="/Materials/decor-element-2.webp 1x" type="image/webp">
<img src="/Materials/decor-element-2.png" alt="" width="0" height="0" loading="lazy">
</picture>
</div>
</div>
<div class="full-page__main">
<form method="post" class="full-page__auth auth-form">
<h1 class="auth-form__title title">
Welcome Back
</h1>
<label class="auth-form__label">
<span><input asp-for="Input.Email" type="email" name="email" placeholder="Email" required="" class="auth-form__input"></span>
</label>
<label class="auth-form__label">
<span><input asp-for="Input.Password" type="password" name="password" placeholder="Password" required="" class="auth-form__input"></span>
</label>

<label class="auth-form__checkbox" style="margin-bottom: 10px;">
<input type="checkbox" name="remember-me" class="auth-form__checkbox-input asp-for="Input.RememberMe">
<span class="auth-form__checkbox-element">
<svg width="16" height="17">
<use href="img/sprites.svg#check"></use>
</svg>
</span>
<span class="auth-form__checkbox-text">
Remember me?
</span>
</label>
<div asp-validation-summary="ModelOnly" class="text-danger" role="alert" style="color: red; font-size:12px; display: block;"></div>
<span asp-validation-for="Input.Email" class="text-danger" style="color: red; font-size:12px; display: block;"></span>
<span asp-validation-for="Input.Password" class="text-danger" style="color: red; font-size:12px; display: block;"></span>
<button class="auth-form__submit button" type="submit" aria-label="Register">
<span aria-hidden="true"></span>
<span>
Login
</span>
</button>
<div class="auth-form__message text">
<p>
Something is wrong. Please try registering later.
</p>
</div>
<div class="auth-form__info min-text">
Don't have an account?<br>
<a href="/Identity/Account/Register">Sign up</a>
</div>
</form>

</div>
</section>
</main>

<footer class="footer">
<div class="footer__decor mode-3" aria-hidden="true">
<div class="footer__decor-blur">
<picture>
<source srcset="/Materials/footer-decor-element-3-blur.webp 1x" type="image/webp">
<img src="/Materials/footer-decor-element-3-blur.png" alt="" width="0" height="0">
</picture>
</div>
<div class="footer__decor-hero">
<img src="/Materials/footer-decor-element-3.svg" width="0" height="0" alt="">
</div>
</div>

<partial name="/Views/Shared/_FooterMeta.cshtml" />

</footer>

<div class="row justify-content-center">
<div class="col-10">
<section>
<form id="account" method="post">
<h2 class="row justify-content-center">Welcome Back</h2>
<hr />
<div asp-validation-summary="ModelOnly" class="text-danger" role="alert"></div>
<div class="form-floating mb-3">
<input asp-for="Input.Email" class="form-control" autocomplete="username" aria-required="true" placeholder="name@example.com" />
<label asp-for="Input.Email" class="form-label">Email</label>
<span asp-validation-for="Input.Email" class="text-danger"></span>
</div>
<div class="form-floating mb-3">
<input asp-for="Input.Password" class="form-control" autocomplete="current-password" aria-required="true" placeholder="password" />
<label asp-for="Input.Password" class="form-label">Password</label>
<span asp-validation-for="Input.Password" class="text-danger"></span>
</div>
<div class="checkbox mb-3">
<label asp-for="Input.RememberMe" class="form-label">
<input class="form-check-input" asp-for="Input.RememberMe" />
@Html.DisplayNameFor(m => m.Input.RememberMe)
</label>
</div>
<div>
<button id="login-submit" type="submit" class="w-100 btn btn-lg btn-primary">Log in</button>
</div>
</form>
</section>
</div>
</div>

@section Scripts {
<partial name="_ValidationScriptsPartial" />
Expand Down
109 changes: 81 additions & 28 deletions src/MTRPZ4.UI/Areas/Identity/Pages/Account/Register.cshtml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,32 +1,85 @@
@page
@model RegisterModel
@{
ViewData["Title"] = "Register";
Layout = "~/Areas/Identity/Pages/_AuthLayout.cshtml";
}

<form id="registerForm" asp-route-returnUrl="@Model.ReturnUrl" method="post">
<h2 class="row justify-content-center">New Account</h2>
<hr />
<div asp-validation-summary="ModelOnly" class="text-danger" role="alert"></div>
<div class="form-floating mb-3">
<input asp-for="Input.Email" class="form-control" autocomplete="username" aria-required="true" placeholder="name@example.com" />
<label asp-for="Input.Email">Email</label>
<span asp-validation-for="Input.Email" class="text-danger"></span>
</div>
<div class="form-floating mb-3">
<input asp-for="Input.Password" class="form-control" autocomplete="new-password" aria-required="true" placeholder="password" />
<label asp-for="Input.Password">Password</label>
<span asp-validation-for="Input.Password" class="text-danger"></span>
</div>
<div class="form-floating mb-3">
<input asp-for="Input.ConfirmPassword" class="form-control" autocomplete="new-password" aria-required="true" placeholder="password" />
<label asp-for="Input.ConfirmPassword">Confirm Password</label>
<span asp-validation-for="Input.ConfirmPassword" class="text-danger"></span>
</div>
<button id="registerSubmit" type="submit" class="w-100 btn btn-lg btn-primary">Register</button>
</form>


<main class="main">
<section class="full-page">
<div class="full-page__background" aria-hidden="true">
<div class="full-page__decor">
<picture>
<source srcset="/Materials/decor-element-4.webp 1x" type="image/webp">
<img src="/Materials/decor-element-4.png" alt="" width="0" height="0" loading="lazy">
</picture>
</div>
<div class="full-page__decor">
<picture>
<source srcset="/Materials/decor-element-5.webp 1x" type="image/webp">
<img src="/Materials/decor-element-5.png" alt="" width="0" height="0" loading="lazy">
</picture>
</div>
<div class="full-page__decor">
<picture>
<source srcset="/Materials/decor-element-2.webp 1x" type="image/webp">
<img src="/Materials/decor-element-2.png" alt="" width="0" height="0" loading="lazy">
</picture>
</div>
</div>
<div class="full-page__main">

<form id="registerForm" asp-route-returnUrl="@Model.ReturnUrl" method="post" class="full-page__auth auth-form">
<h1 class="auth-form__title title">
New Account
</h1>
<hr />
<div asp-validation-summary="ModelOnly" class="text-danger" role="alert"></div>
<label class="auth-form__label">
<input asp-for="Input.Email" class="auth-form__input" autocomplete="username" aria-required="true" placeholder="Email" />
</label>
<label class="auth-form__label">
<input asp-for="Input.Password" class="auth-form__input" autocomplete="new-password" aria-required="true" placeholder="Password" />
</label>
<label class="auth-form__label" style="margin-bottom: 10px;">
<input asp-for="Input.ConfirmPassword" class="auth-form__input" autocomplete="new-password" aria-required="true" placeholder="Confirm password" />
</label>
<hr />
<span asp-validation-for="Input.Email " class="text-danger" style="color: red; font-size:12px; display: block;"></span>
<span asp-validation-for="Input.Password" class="text-danger" style="color: red; font-size: 12px; display: block;"></span>
<span asp-validation-for="Input.ConfirmPassword" class="text-danger" style="color: red; font-size: 12px; display: block;"></span>


<button class="auth-form__submit button" type="submit" aria-label="Register">
<span aria-hidden="true"></span>
<span>
Register
</span>
</button>

<div class="auth-form__info min-text">
Already have an account?<br>
<a href="/Identity/Account/Login">Sign in</a>
</div>
</form>
</div>
</section>
</main>

<footer class="footer">
<div class="footer__decor mode-3" aria-hidden="true">
<div class="footer__decor-blur">
<picture>
<source srcset="/Materials/footer-decor-element-3-blur.webp 1x" type="image/webp">
<img src="/Materials/footer-decor-element-3-blur.png" alt="" width="0" height="0">
</picture>
</div>
<div class="footer__decor-hero">
<img src="/Materials/footer-decor-element-3.svg" width="0" height="0" alt="">
</div>
</div>

<partial name="/Views/Shared/_FooterMeta.cshtml" />

</footer>


@section Scripts {
<partial name="_ValidationScriptsPartial" />
}
}
42 changes: 0 additions & 42 deletions src/MTRPZ4.UI/Areas/Identity/Pages/_AuthLayout.cshtml
View file
Open in desktop

This file was deleted.

78 changes: 70 additions & 8 deletions src/MTRPZ4.UI/Views/Home/Index.cshtml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,70 @@
@{
ViewData["Title"] = "Home Page";
}

<div class="text-center">
<h1 class="display-4">Welcome</h1>
<a class="nav-link text-dark" asp-controller="Test" asp-action="Index">Go to Test</a>
</div>
<main class="main">
<section class="full-page">
<div class="full-page__background" aria-hidden="true">
<div class="full-page__decor">
<picture>
<source srcset="Materials/decor-element-4.webp 1x" type="image/webp">
<img src="Materials/decor-element-4.png" alt="" width="0" height="0" loading="lazy">
</picture>
</div>
<div class="full-page__decor">
<picture>
<source srcset="Materials/decor-element-5.webp 1x" type="image/webp">
<img src="Materials/decor-element-5.png" alt="" width="0" height="0" loading="lazy">
</picture>
</div>
<div class="full-page__decor">
<picture>
<source srcset="/Materials/decor-element-2.webp 1x" type="image/webp">
<img src="/Materials/decor-element-2.png" alt="" width="0" height="0" loading="lazy">
</picture>
</div>
</div>
<div class="full-page__main">
<div class="full-page__content">
<h1 class="full-page__title main-title">
Testing
</h1>
<div class="full-page__text text">
<p>
Welcome to our survey of the most appealing style configurations.
To start testing, please click the button below.
</p>
</div>
<a asp-controller="Test" asp-action="Index" class="full-page__button button is-transparent" aria-label="Start testing">
<span aria-hidden="true"></span>
<span>
Start testing
</span>
</a>
</div>
</div>
</section>
</main>

<footer class="footer">
<div class="footer__decor mode-3" aria-hidden="true">
<div class="footer__decor-blur">
<picture>
<source srcset="/Materials/footer-decor-element-3-blur.webp 1x" type="image/webp">
<img src="/Materials/footer-decor-element-3-blur.png" alt="" width="0" height="0">
</picture>
</div>
<div class="footer__decor-hero">
<img src="/Materials/footer-decor-element-3.svg" width="0" height="0" alt="">
</div>
</div>

<partial name="/Views/Shared/_FooterMeta.cshtml" />

</footer>

<script>
var home = document.getElementById("Home");
var testing = document.getElementById("Testing");
var result = document.getElementById("Results");

home.classList.add("is-current");
testing.classList.remove("is-current");
result.classList.remove("is-current");
</script>
Loading
Loading