add base template + mainController
This commit is contained in:
Olivier PARPAILLON
@@ -4,4 +4,33 @@
|
|||||||
|
|
||||||
body {
|
body {
|
||||||
background-color: skyblue;
|
background-color: skyblue;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
html, body {
|
||||||
|
height: 100%; /* S'assurer que la hauteur de la page prend tout l'espace disponible */
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
flex-grow: 1; /* Permet au contenu principal de prendre l'espace restant */
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
background-color: #f8f9fa;
|
||||||
|
padding: 20px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.star {
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 2rem;
|
||||||
|
color: lightgray;
|
||||||
|
transition: color 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.star.text-yellow-500 {
|
||||||
|
color: gold;
|
||||||
}
|
}
|
||||||
16
src/Controller/MainController.php
Normal file
16
src/Controller/MainController.php
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
namespace App\Controller;
|
||||||
|
|
||||||
|
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
|
||||||
|
use Symfony\Component\HttpFoundation\Response;
|
||||||
|
use Symfony\Component\Routing\Attribute\Route;
|
||||||
|
|
||||||
|
class MainController extends AbstractController
|
||||||
|
{
|
||||||
|
#[Route('/', name: 'home')]
|
||||||
|
public function index(): Response
|
||||||
|
{
|
||||||
|
return $this->render('main/index.html.twig');
|
||||||
|
}
|
||||||
|
}
|
||||||
48
templates/main/base.html.twig
Normal file
48
templates/main/base.html.twig
Normal file
@@ -0,0 +1,48 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Sortie</title>
|
||||||
|
{% block stylesheets %}
|
||||||
|
{{ encore_entry_link_tags('app') }}
|
||||||
|
{% endblock %}
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
{% include 'main/header.html.twig' %}
|
||||||
|
</header>
|
||||||
|
<main>
|
||||||
|
{% for label, messages in app.flashes %}
|
||||||
|
{% for message in messages %}
|
||||||
|
{% if label == 'success' %}
|
||||||
|
<div class="p-4 text-sm text-green-800 rounded-lg bg-green-50 dark:bg-gray-800 dark:text-green-400 text-center" role="alert">
|
||||||
|
<span class="font-medium">
|
||||||
|
{{ message }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
{% if label == 'error' %}
|
||||||
|
<div class="p-4 text-sm text-red-800 rounded-lg bg-red-50 dark:bg-gray-800 dark:text-red-400 text-center" role="alert">
|
||||||
|
<span class="font-medium">
|
||||||
|
{{ message }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
{% if label == 'warning' %}
|
||||||
|
<div class="p-4 text-sm text-yellow-800 rounded-lg bg-yellow-50 dark:bg-gray-800 dark:text-yellow-400 text-center" role="alert">
|
||||||
|
<span class="font-medium">
|
||||||
|
{{ message }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
{% endfor %}
|
||||||
|
{% block content %}
|
||||||
|
{% endblock %}
|
||||||
|
</main>
|
||||||
|
<footer>
|
||||||
|
{% include 'main/footer.html.twig' %}
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
16
templates/main/footer.html.twig
Normal file
16
templates/main/footer.html.twig
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Sortie</title>
|
||||||
|
{% block stylesheets %}
|
||||||
|
{{ encore_entry_link_tags('app') }}
|
||||||
|
{% endblock %}
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="bg-gray-100 flex items-center justify-center">
|
||||||
|
© Sortie {{ "now"|date("Y") }}
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
51
templates/main/header.html.twig
Normal file
51
templates/main/header.html.twig
Normal file
@@ -0,0 +1,51 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Sortie</title>
|
||||||
|
{% block stylesheets %}
|
||||||
|
{{ encore_entry_link_tags('app') }}
|
||||||
|
{% endblock %}
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="mx-auto">
|
||||||
|
<nav class="flex justify-between items-center py-4 bg-gray-100 shadow-md">
|
||||||
|
<!-- Titre + Logo -->
|
||||||
|
<a href="/">
|
||||||
|
<div class="flex items-center space-x-3 pl-4">
|
||||||
|
<h3 class="text-2xl font-bold">Sortie</h3>
|
||||||
|
<img src="{{ asset('img/logo.png') }}" alt="Logo" class="h-10">
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<!-- Liens de navigation -->
|
||||||
|
<div class="relative">
|
||||||
|
<button id="menu-button" class="p-2 pr-4 text-gray-700 font-bold hover:text-blue-500 focus:outline-none">
|
||||||
|
<img alt="burger-menu" src="{{ asset('img/burger-bar.png') }}">
|
||||||
|
</button>
|
||||||
|
<ul id="navbar" class="hidden absolute top-12 right-0 w-48 bg-white shadow-md p-4 flex-col space-y-4">
|
||||||
|
<li><a href="/" class="text-gray-700 font-bold hover:text-blue-500">Accueil</a></li>
|
||||||
|
<li><a href="/" class="text-gray-700 font-bold hover:text-blue-500">Sortie</a></li>
|
||||||
|
<li><a href="/" class="text-gray-700 font-bold hover:text-blue-500">ToDo</a></li>
|
||||||
|
<li><a href="/" class="text-gray-700 font-bold hover:text-blue-500">À propos</a></li>
|
||||||
|
{# <li><a href="#Contact" class="text-gray-700 font-bold hover:text-blue-500">Contact</a></li>#}
|
||||||
|
{# {% if app.user %}#}
|
||||||
|
{# <li><a href="{{ path('auth_logout') }}" class="text-gray-700 font-bold hover:text-blue-500">Se déconnecter</a></li>#}
|
||||||
|
{# {% else %}#}
|
||||||
|
{# <li><a href="{{ path('auth_register') }}" class="text-gray-700 font-bold hover:text-blue-500">S'inscrire</a></li>#}
|
||||||
|
{# <li><a href="{{ path('auth_login') }}" class="text-gray-700 font-bold hover:text-blue-500">Se connecter</a></li>#}
|
||||||
|
{# {% endif %}#}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.getElementById('menu-button').addEventListener('click', function () {
|
||||||
|
const navbar = document.getElementById('navbar');
|
||||||
|
navbar.classList.toggle('hidden');
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</html>
|
||||||
23
templates/main/index.html.twig
Normal file
23
templates/main/index.html.twig
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
{% extends 'main/base.html.twig' %}
|
||||||
|
{% block head %}
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Sortie</title>
|
||||||
|
{% block stylesheets %}
|
||||||
|
{{ encore_entry_link_tags('app') }}
|
||||||
|
{% endblock %}
|
||||||
|
</head>
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
|
{%block content %}
|
||||||
|
<div class="flex justify-center items-center py-52">
|
||||||
|
<div class="bg-white shadow-lg rounded-lg p-8 max-w-md text-center">
|
||||||
|
<img src="{{ asset('img/logo-512.png') }}" alt="Logo" class="h-28 mx-auto mb-4">
|
||||||
|
<h3 class="text-2xl font-bold text-center pb-3">Créer une nouvelle sortie</h3>
|
||||||
|
<p class="text-gray-700 text-justify mb-4">Vous pouvez créer une liste de voeux facilement depuis mon application web ! Cliquer sur le bouton juste en dessous pour continuer</p>
|
||||||
|
<div class="flex flex-row justify-between">
|
||||||
|
<p>test</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% endblock %}
|
||||||
Reference in New Issue
Block a user