Assassymfony
/
fukafukashita
4
0
Fork 0
Code Issues Pull Requests Packages Projects 1 Releases Wiki Activity

Styling login & register

Browse Source
pull/28/head
Corentin RICHARD 10 months ago
parent edfec6a350
commit 50f92d06be
7 changed files with 225 additions and 53 deletions
Show Stats Download Patch File Download Diff File

1
config/packages/framework.yaml
Unescape View File

@ -2,6 +2,7 @@
framework:
secret: '%env(APP_SECRET)%'
#csrf_protection: true
# error_controller: App\Controller\ErrorController::show
# Note that the session will be started ONLY if you read or write from it.
session: true

1
config/packages/twig.yaml
Unescape View File

@ -2,6 +2,7 @@ twig:
file_name_pattern: '*.twig'
form_themes: ['form_div_layout.html.twig']
when@test:
twig:
strict_variables: true

12
templates/base.html.twig
Unescape View File

@ -8,6 +8,16 @@
<link rel="stylesheet" href="{{ asset('styles/app.css')}}">
{% block stylesheets %}
<style>
.body-container {
display: flex;
justify-content: center;
align-items: center;
min-height: 80vh;
padding: 20px;
background-color: #f0f0f0;
}
</style>
{% endblock %}
{% block javascripts %}
@ -33,6 +43,8 @@
</div>
</nav>
</header>
<div class="body-container">
{% block body %}{% endblock %}
</div>
<button class="floating-button" onclick="location.href='/post/new'">+</button>
</html>

7
templates/error.html.twig → templates/bundles/TwigBundle/Exception/error.html.twig
Unescape View File

@ -1,3 +1,8 @@
{% extends 'base.html.twig' %}
{% block title %}Page non trouvée{% endblock %}
{% block body %}
<!DOCTYPE html>
<html lang="en">
<head>
@ -54,3 +59,5 @@
</div>
</body>
</html>
{% endblock %}

64
templates/bundles/TwigBundle/Exception/error404.html.twig
Unescape View File

@ -0,0 +1,64 @@
{% extends 'base.html.twig' %}
{% block title %}Page non trouvée{% endblock %}
{% block body %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Error</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #1a2c4c; /* Big Stone */
color: #bda3b6; /* Lily */
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
.error-container {
text-align: center;
border: 1px solid #38476b; /* Rhino */
background-color: #5c5d7f; /* Comet */
padding: 20px;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.error-container h1 {
font-size: 48px;
margin: 0;
color: #928ba2; /* Manatee */
}
.error-container p {
font-size: 18px;
margin: 10px 0 20px;
}
.error-container a {
text-decoration: none;
color: #1a2c4c; /* Big Stone */
font-weight: bold;
border: 1px solid #1a2c4c; /* Big Stone */
padding: 10px 20px;
border-radius: 5px;
background-color: #bda3b6; /* Lily */
}
.error-container a:hover {
background-color: #928ba2; /* Manatee */
}
</style>
</head>
<body>
<div class="error-container">
<h1>Page Not Found</h1>
<h2>Error 404 </h2>
<p>We're sorry, but something went wrong. Please try again later.</p>
{# <a href="{{ path('homepage') }}">Go to Homepage</a> #}
</div>
</body>
</html>
{% endblock %}

49
templates/registration/register.html.twig
Unescape View File

@ -3,10 +3,54 @@
{% block title %}Register{% endblock %}
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('styles/app.css') }}">
<style>
.form-container {
background-color: #ffffff;
padding: 2rem;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 400px;
text-align: center;
}
.form-container h1 {
margin-bottom: 1.5rem;
}
.form-container .btn {
margin-top: 1rem;
width: 100%;
padding: 0.5rem;
border: none;
background-color: #007bff;
color: #ffffff;
border-radius: 4px;
cursor: pointer;
}
.form-container .btn:hover {
background-color: #0056b3;
}
.form-container a {
display: block;
margin-top: 1rem;
color: #007bff;
text-decoration: none;
}
.form-container a:hover {
text-decoration: underline;
}
</style>
{% endblock %}
{% block body %}
<div class="form-container" >
<h1>Register</h1>
{{ form_errors(registrationForm) }}
@ -20,4 +64,7 @@
<button type="submit" class="btn">Register</button>
{{ form_end(registrationForm) }}
<a href="/login"> or Login </a>
</div>
{% endblock %}

52
templates/security/login.html.twig
Unescape View File

@ -4,9 +4,52 @@
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('styles/app.css') }}">
<style>
.form-container {
background-color: #ffffff;
padding: 2rem;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 400px;
text-align: center;
}
.form-container h1 {
margin-bottom: 1.5rem;
}
.form-container .btn {
margin-top: 1rem;
width: 100%;
padding: 0.5rem;
border: none;
background-color: #007bff;
color: #ffffff;
border-radius: 4px;
cursor: pointer;
}
.form-container .btn:hover {
background-color: #0056b3;
}
.form-container a {
display: block;
margin-top: 1rem;
color: #007bff;
text-decoration: none;
}
.form-container a:hover {
text-decoration: underline;
}
</style>
{% endblock %}
{% block body %}
<div class="form-container">
<form method="post">
{% if error %}
<div class="alert alert-danger">{{ error.messageKey|trans(error.messageData, 'security') }}</div>
@ -24,9 +67,7 @@
<label for="password">Password</label>
<input type="password" name="_password" id="password" class="form-control" autocomplete="current-password" required>
<input type="hidden" name="_csrf_token"
value="{{ csrf_token('authenticate') }}"
>
<input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
{#
Uncomment this section and add a remember_me option below your firewall to activate remember me functionality.
@ -39,10 +80,9 @@
</div>
#}
<button class="btn btn-lg btn-primary" type="submit">
Sign in
</button>
<button class="btn btn-lg btn-primary" type="submit">Sign in</button>
</form>
<a href="/register">Or Register</a>
</div>
{% endblock %}

Write Preview
Loading…
Cancel
Save