DjalimSimaila/Projet-Symfony
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

register working

Browse Source
This commit is contained in:
ZeKap 2024-02-22 11:05:30 +01:00
parent 6ffd02c467
commit 20d4bfd407
No known key found for this signature in database
GPG Key ID: 8D70E0631DD5792A
4 changed files with 109 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
assets/styles/app.css
View File

@ -13,17 +13,24 @@
a {
color: inherit;
text-decoration: none;
transition: all ease-out 0.3s;
&:hover {
font-weight: 700;
}
&.no-style {
text-decoration: none;
}
}
/*Main content (between header and footer)*/
body > main {
min-height: calc(100vh - ((2rem + 2 * 0.75rem) + 6rem));
height: fit-content;
/* height: fit-content; */
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
/*fix symfony template style*/

7
templates/base.html.twig
View File

@ -16,7 +16,7 @@
<body>
{% block header %}
<header>
<a href="{{url('index')}}">Frutti</a>
<a class="no-style" href="{{url('index')}}">Frutti</a>
<form action="{{url('app_search')}}" method="get">
<input type="text" name="q" id="q" placeholder="Search" />
<select name="fruit" id="fruit">
@ -41,7 +41,10 @@
<img src="{{ asset('/styles/search.svg') }}" alt="Search" />
</label>
</form>
<a href="{{url('app_login')}}">Login</a>
<div>
<a class="no-style" href="{{url('app_register')}}">Register</a>
<a class="no-style" href="{{url('app_login')}}">Login</a>
</div>
</header>
{% endblock %}

93
templates/registration/register.html.twig
View File

@ -1,19 +1,86 @@
{% extends 'base.html.twig' %}
{% extends 'base.html.twig' %} {% block title %}Register{% endblock %} {% block
body %}
<style>
main#register > form {
display: flex;
flex-direction: column;
gap: var(--size-max);
justify-content: center;
align-items: center;
min-width: 300px;
max-width: 10rem;
justify-content: center;
align-items: center;
& > label:not(label[for="registration_form_agreeTerms"]) {
display: none;
}
& > :is(input[type="text"], input[type="password"]) {
height: var(--size-max);
border-radius: var(--radius);
padding: calc(var(--size-max) / 2) var(--size-max);
border: none;
background: var(--grey);
width: 80%;
}
& > input[type="submit"] {
cursor: pointer;
background: var(--light);
border: none;
border-radius: var(--radius);
box-shadow: var(--shadow);
color: var(--dark);
padding: calc(var(--size-max) - 8px) 0;
width: 70%;
height: 20%;
transition: all ease-out 0.2s;
&:hover {
box-shadow: var(--shadow-hover);
}
}
}
</style>
<main id="register">
{{ form_start(registrationForm) }} {% if app.user %}
<div class="mb-3">
You are logged in as {{ app.user.userIdentifier }},
<a href="{{ path('app_logout') }}">Logout</a>
</div>
{% endif %}
{% block title %}Register{% endblock %}
<h2>Register</h2>
{{ form_errors(registrationForm.username) }}
<label for="username">Username</label>
<input
type="text"
name="{{field_name(registrationForm.username)}}"
value="{{field_value(registrationForm.username)}}"
id="username"
class="form-control"
autocomplete="username"
placeholder="Username"
max-length="180"
required
autofocus
/>
{{ form_errors(registrationForm.plainPassword) }}
<label for="password">Password</label>
<input
type="password"
name="{{field_name(registrationForm.plainPassword)}}"
class="form-control"
autocomplete="new-password"
placeholder="Password"
required
/>
{% block body %}
<h1>Register</h1>
{{ form_row(registrationForm.agreeTerms) }}
{{ form_errors(registrationForm) }}
<input type="submit" value="Register" />
<p>
If you don't have an account:
<a href="{{url('app_register')}}">register</a>.
</p>
{{ form_start(registrationForm) }}
{{ form_row(registrationForm.username) }}
{{ form_row(registrationForm.plainPassword, {
label: 'Password'
}) }}
{{ form_row(registrationForm.agreeTerms) }}
<button type="submit" class="btn">Register</button>
{{ form_end(registrationForm) }}
</main>
{% endblock %}

41
templates/security/login.html.twig
View File

@ -1,40 +1,23 @@
{% extends 'base.html.twig' %} {% block title %}Log in!{% endblock %} {% block
body %}
<style>
main#login {
padding: var(--size-max);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: var(--size-max);
& > hr {
width: 2px;
height: 250px;
border: none;
background: var(--dark);
border-radius: var(--radius);
}
}
main#login > section > form {
main#login > form {
display: flex;
flex-direction: column;
gap: var(--size-max);
justify-content: center;
align-items: center;
min-width: 300px;
max-width: 10rem;
justify-content: center;
align-items: center;
& > label {
display: none;
}
&
> :is(
input[type="text"],
input[type="email"],
input[type="password"]
) {
& > :is(input[type="text"], input[type="password"]) {
height: var(--size-max);
border-radius: var(--radius);
padding: var(--size-max);
padding: calc(var(--size-max) / 2) var(--size-max);
border: none;
background: var(--grey);
width: 80%;
@ -69,7 +52,7 @@ body %}
</div>
{% endif %}
<h1 class="h3 font-weight-normal mb-3">Please sign in</h1>
<h2>Login</h2>
<label for="username">Username</label>
<input
type="text"
@ -78,6 +61,7 @@ body %}
id="username"
class="form-control"
autocomplete="username"
placeholder="Username"
required
autofocus
/>
@ -88,6 +72,7 @@ body %}
id="password"
class="form-control"
autocomplete="current-password"
placeholder="Password"
required
/>
@ -108,7 +93,11 @@ body %}
</div>
#}
<button class="btn btn-lg btn-primary" type="submit">Sign in</button>
<input type="submit" value="Sign in" />
<p>
If you don't have an account:
<a href="{{url('app_register')}}">register</a>.
</p>
</form>
</main>
{% endblock %}