Basic styling of the login page

This commit is contained in:
bad 2021-11-26 10:45:44 +01:00
parent 08ecbe31da
commit adf94ac2a1
5 changed files with 56 additions and 23 deletions

View file

@ -38,6 +38,7 @@ nav .fa {
main { main {
display: flex; display: flex;
flex-direction: column;
width: min(max(90vw,1080px), 100%); width: min(max(90vw,1080px), 100%);
background-color: beige; background-color: beige;
flex-grow: 1; flex-grow: 1;

13
resources/scss/login.scss vendored Normal file
View file

@ -0,0 +1,13 @@
.login-register-container {
display: flex;
width: 100%;
justify-content: space-around;
flex-wrap: wrap;
& div {
&, & form {
display: flex;
flex-direction: column;
}
}
}

View file

@ -16,6 +16,18 @@
</div> </div>
</nav> </nav>
<main> <main>
<div class="alerts">
@if(Session::has('success'))
<div class="alert alert-success">
{{ Session::get('success') }}
</div>
@endif
@foreach($errors->all() as $message)
<div class="alert alert-error">
{{ $message }}
</div>
@endforeach
</div>
@yield('main') @yield('main')
</main> </main>

View file

@ -1,31 +1,35 @@
@extends('layouts.app') @extends('layouts.app')
@push('head')
<link rel="stylesheet" href="{{ mix("css/login.css") }}">
@endpush
@section('title', "Sklep") @section('title', "Sklep")
@section('main') @section('main')
@if(Session::has('success'))
<div class="alert alert-success"> <div class="login-register-container">
{{ Session::get('success') }} <div class="login-register-form">
</div> <h1> Zaloguj się </h1>
@endif <form method="post">
<div> <input type="email" name="email">
<form method="post"> <input type="password" name="password">
<input type="email" name="email"> <input type="submit">
<input type="password" name="password"> @csrf
<input type="submit"> </form>
@csrf </div>
</form> <div>
</div> <h1> Zarejstruj się </h1>
<div> <form method="post" action="{{ url("register") }}">
<form method="post" action="{{ url("register") }}"> <!-- TODO validation in js !-->
<!-- TODO validation in js !--> <input type="email" name="email" placeholder="email">
<input type="email" name="email" placeholder="email"> <input type="text" name="name" placeholder="Imie">
<input type="text" name="name" placeholder="Imie"> <input type="password" name="password" placeholder="Hasło">
<input type="password" name="password" placeholder="Hasło"> <input type="password" name="repeat-password" placeholder="Powtórz hasło">
<input type="password" name="repeat-password" placeholder="Powtórz hasło"> <input type="submit">
<input type="submit"> @csrf
@csrf </form>
</form> </div>
</div> </div>
</body> </body>
</html> </html>

3
webpack.mix.js vendored
View file

@ -14,4 +14,7 @@ const mix = require("laravel-mix");
mix.js("resources/js/app.js", "public/js").sass( mix.js("resources/js/app.js", "public/js").sass(
"resources/scss/app.scss", "resources/scss/app.scss",
"public/css" "public/css"
).sass(
"resources/scss/login.scss",
"public/css"
); );