diff --git a/public/css/base.css b/public/css/base.css
index 4169977baf217d3e1558171218854905488e37b0..3f0f74a95b8768c1bcd6e86a91febfcf215d6d1b 100644
--- a/public/css/base.css
+++ b/public/css/base.css
@@ -128,7 +128,7 @@ header a{
top: 50%;
left: 50%;
border-radius: 4px;
- background-color: white;
+ background-color: #FFFDF3;
margin-bottom: 5px;
}
@@ -201,7 +201,7 @@ img[alt="rond-blanc"]{
font-family: 'SedwickAveDisplay';
font-size:3rem;
text-align: center;
- color: white;
+ color: #FFFDF3;
}
.nav.active {
@@ -239,7 +239,7 @@ img[alt="rond-blanc"]{
.nav__link{
text-decoration: none;
- color: white;
+ color: #FFFDF3;
}
.nav__link:hover{
@@ -249,6 +249,24 @@ img[alt="rond-blanc"]{
}
/* FIN MENU */
+/* section Big-Title */
+.section-BigTitle{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ min-height:100vh;
+}
+
+.logo img{
+ width: 20rem;
+}
+.logo h1{
+ font-family: 'SedwickAveDisplay';
+ font-size:4rem;
+ color:#171302;
+ text-align: center;
+}
+
/* FOOTER */
@@ -260,7 +278,7 @@ footer{
padding:15px;
flex-direction: column;
align-items: center;
- color: white;
+ color:#FFFDF3;
height:250px;
text-align: center;
}
diff --git a/public/css/oeuvres.css b/public/css/oeuvres.css
index 5a29f4087ec37ac5ac0be8102c56dc9eaf5908f3..ecbb4a097304c5a28b2c6918f737ac6184b68557 100644
--- a/public/css/oeuvres.css
+++ b/public/css/oeuvres.css
@@ -45,6 +45,10 @@ body{
}
.decouv i{
font-size: 3rem;
+ color:#171302;
+}
+.decouv i:hover{
+ color:#FF8C00;
}
.bg{
@@ -142,6 +146,9 @@ body{
right:0;
color: #FFFDF3;
}
+.card i:hover{
+ color:#FF8C00;
+}
.lien{
diff --git a/public/css/parcour.css b/public/css/parcour.css
index 1524c4ecc2a1c7c6186f8278f02606480d260bf5..ca14af6734b7dcdb7d4f268e546ad822a65015d4 100644
--- a/public/css/parcour.css
+++ b/public/css/parcour.css
@@ -9,16 +9,20 @@
}
.note_parc {
- display: none;
+ display: block;
+ text-align: right;
+ font-weight: bolder;
+ font-size:1.1rem;
}
.parcours_intro p {
width: 50%;
}
-.parcours_intro h2 {
- width: 40%;
+.parcours_intro h4 {
+ width: 50%;
text-align: center;
+ font-size:1.8rem;
}
div#carte {
@@ -43,6 +47,7 @@ div.cadre {
.parcours_prez {
height: 100vh;
+ margin: auto;
}
@@ -130,38 +135,39 @@ div.cadre {
margin: auto;
}
-.caroussel {
+/* section oeuvres */
+.oeuvres {
display: flex;
- flex-direction: column;
+ justify-content: center;
align-items: center;
-
- margin-top: 2rem;
-
- background: lightgray;
- padding-top: 2rem;
- padding-bottom: 2rem;
}
-
-.buttons {
- display: flex;
- gap: 24rem;
- margin-top: -7rem;
- margin-bottom: 8rem;
+.oeuvres button{
+ display:none;
}
-
-#image {
- width: 18rem;
- height: 12rem;
+.oeuvres button i{
+ font-size:2rem;
}
-.oeuvres {
- height: 100vh;
-
- display: flex;
- justify-content: center;
+.caroussel {
+ margin-top: 2rem;
+ background: #FFD700;
+ margin-bottom: 100px;
+}
+.caroussel h2{
+ font-family: 'Tanker';
+ font-size:2rem;
+}
+.vue{
+ display:flex !important;
align-items: center;
+ justify-content: space-evenly;
+ flex-direction: column;
+}
+.image {
+ width: 50%;
+ height: 50%;
+ margin-top:50px;
}
-
.desc {
width: 50%;
}
@@ -169,30 +175,23 @@ div.cadre {
.adresse_parc {
display: flex;
align-items: center;
-
margin-top: 1rem;
}
/* Logo maps */
.adresse_parc i {
- color: red;
+ color:red;
font-size: 1.7rem;
-
padding-right: 2rem;
}
-
.adresse_parc a {
font-size: 1.2rem;
-
margin-right: 3rem;
}
+
@media screen and (min-width: 1024px) {
.note_parc {
- display: block;
-
- text-align: right;
- font-weight: bolder;
font-size: 1.25rem;
}
@@ -200,83 +199,65 @@ div.cadre {
font-size: 1.15rem;
}
+ .parcours_intro h4 {
+ font-size:2rem;
+ }
+
.parcour_prez {
height: 100vh;
-
display: flex;
justify-content: center;
}
div#carte {
- height: 64rem;
+ height:75%;
width: 80%;
}
- /* Caroussel */
- #image {
- width: 20rem;
- height: 15rem;
- }
-
- .oeuvres {
- height: 100vh;
-
- display: flex;
- justify-content: center;
- align-items: center;
- }
-
-
- .buttons {
- position: absolute;
- margin: 0;
-
- display: flex;
- gap: 76rem;
+ /* Section oeuvres */
+ .oeuvres button{
+ background-color:#FFFDF3;
+ border:none;
+ cursor: pointer;
}
-
.caroussel {
- display: flex;
- flex-direction: row;
- background: lightgrey;
- padding-top: 5rem;
- padding-bottom: 5rem;
width: 80%;
- justify-content: center;
+ }
- gap: 11rem;
+ .vue{
+ flex-direction: row;
+ }
+ .image {
+ width: 25%;
+ height: 25%;
+ margin-top:0;
}
.adresse_parc i {
- color: red;
font-size: 1.7rem;
-
padding-right: 2rem;
}
-
.adresse_parc a {
font-size: 1.2rem;
-
margin-right: 3rem;
}
-
.desc {
width: auto;
}
-
.info {
display: flex;
flex-direction: column;
width: 30%;
}
+
+
#before,
#after {
display: contents;
font-size: 2rem;
-
cursor: pointer;
}
diff --git a/public/js/parc.js b/public/js/parc.js
index 85448444ee26b008fe4f2953f2cae650aa03272c..d5ae9b5527ae79318f5fbc16c24dea4982d22b3e 100644
--- a/public/js/parc.js
+++ b/public/js/parc.js
@@ -1,12 +1,11 @@
-
var xhr = new XMLHttpRequest();
-var xhr2 = new XMLHttpRequest();
+var xhr2 = new XMLHttpRequest();
var map;
//initialisation de la carte
var iut;
var service;
-
+
function initMap() {
iut = new google.maps.LatLng(48.5734053, 7.7521113);
@@ -16,7 +15,7 @@ function initMap() {
});
-
+
// xhr.open("GET", "data.json");
// xhr.send();
// xhr2.open('GET', 'info.json', true);
@@ -64,9 +63,9 @@ function initMap() {
// });
// infowindow.open(map);
// }
-
+
// }
-
+
// }
@@ -83,54 +82,21 @@ function initMarker(map, position, label, title) {
}
-let image = document.getElementById('image');
-
-
-let images = [
- "graf1.png",
- "graf2.png",
- "animal1.jpg",
- "animal2.jpg",
- "animal3.jpg",
- "animal4.jpg",
-]
-
-let currentIndex = 0;
-
-function changeImage() {
- currentIndex++;
- if (currentIndex >= images.length) {
- currentIndex = 0;
- }
- image.src = images[currentIndex];
-}
-
-let timer = setInterval(changeImage, 3000);
-
-function preImage() {
- currentIndex--;
- if (currentIndex < 0){
- currentIndex = images.length-1;
- }
- image.src = images[currentIndex];
-}
-
-let button1 = document.getElementById("before");
-let button2 = document.getElementById("after");
-button2.addEventListener("click", function (event) {
- clearInterval(timer); // remet le timer à 0
- changeImage();
- timer = setInterval(changeImage, 3000); // on redéfinit le timer / !! pas remettre de let, on change juste la valeur
-})
-
-button1.addEventListener("click", function (event) {
- clearInterval(timer);
- preImage();
- timer = setInterval(changeImage, 3000);
-})
-
-
-
-
+// CAROUSSEL
+$(document).ready(function () {
+ $('.slick-slider').slick({
+ infinite: true,
+ slidesToShow: 1,
+ slidesToScroll: 1,
+ adaptiveHeight :true,
+ prevArrow: '.slick-prev',
+ nextArrow: '.slick-next',
+ responsive: [
+ {
+ breakpoint: 1024,
+ settings: "unslick"
+ }]
+ });
+});
\ No newline at end of file
diff --git a/src/Controller/ParcoursController.php b/src/Controller/ParcoursController.php
index beb19003e1cb4124e6145e9e71139d54b8fb1e1c..87ecab50a4c1cdbc1e82a06f420424ab915ba9e7 100644
--- a/src/Controller/ParcoursController.php
+++ b/src/Controller/ParcoursController.php
@@ -67,11 +67,12 @@ class ParcoursController extends AbstractController
public function show(Parcours $parcour): Response
{
+ $oeuvres = $parcour->getRelaOeuvre();
$comment = $parcour->getComment();
-
return $this->render('parcours/show.html.twig', [
'parcour' => $parcour,
- 'comments' => $comment
+ 'comments' => $comment,
+ 'oeuvres' => $oeuvres,
]);
}
diff --git a/src/Repository/OeuvreRepository.php b/src/Repository/OeuvreRepository.php
index b55249bd6093ecbd5bb7888224589aba94fded4a..e333487f2c9cc520d629a37e9120c6fbc82460ba 100644
--- a/src/Repository/OeuvreRepository.php
+++ b/src/Repository/OeuvreRepository.php
@@ -40,18 +40,6 @@ class OeuvreRepository extends ServiceEntityRepository
}
}
- // public function findAllOeuvreByIdCateg($rela_cat)
- // {
- // return $this->createQueryBuilder('o')
- // ->join('o.category','c')
- // ->where('c.id = :rela_cat')
- // ->setParameters([
- // "rela_cat" => $rela_cat,
- // ])
- // ->getQuery()
- // ->getResult()
- // ;
- // }
public function findAllOeuvreByIdCateg($id)
{
$entityManager = $this->getEntityManager();
diff --git a/src/Repository/ParcoursRepository.php b/src/Repository/ParcoursRepository.php
index dd5c17f33dd361b6e58fc8077cde39128b8cc38b..57137a3a96ccdbd3a493231f20a86b490741d6d2 100644
--- a/src/Repository/ParcoursRepository.php
+++ b/src/Repository/ParcoursRepository.php
@@ -3,6 +3,7 @@
namespace App\Repository;
use App\Entity\Parcours;
+use App\Entity\Oeuvre;
use Doctrine\Bundle\DoctrineBundle\Repository\ServiceEntityRepository;
use Doctrine\Persistence\ManagerRegistry;
@@ -39,6 +40,19 @@ class ParcoursRepository extends ServiceEntityRepository
}
}
+ public function findAllOeuvreByIdParc($id)
+ {
+ $entityManager = $this->getEntityManager();
+ $query = $entityManager->createQuery(
+ 'SELECT o, p
+ FROM App\Entity\Oeuvre o
+ INNER JOIN o.rela_oeuvre p
+ WHERE p.id = :id'
+ )->setParameter('id', $id);
+
+ return $query->getResult();
+ }
+
// /**
// * @return Parcours[] Returns an array of Parcours objects
// */
diff --git a/templates/base.html.twig b/templates/base.html.twig
index 66dca20d8011dab5ad5f40c2e836a292e2f3a169..6b232a1ebaf0d51442f7029a7e4b143697c74ea7 100644
--- a/templates/base.html.twig
+++ b/templates/base.html.twig
@@ -68,8 +68,29 @@
<div class="zigzag"></div>
-<body>
- <main>
+ {# <div class="header__nav">
+ <nav class="nav">
+ <ul class="nav__list">
+ <li class="nav__list_item"><a class="nav__link" href="{{ path('home') }}">Accueil</a></li>
+ <li class="nav__list_item"><a class="nav__link" href="{{ path('parcours') }}">Les Parcours</a></li>
+ <li class="nav__list_item"><a class="nav__link" href="{{ path('app_oeuvre_index') }}">Les Oeuvres</a></li>
+ <li class="nav__list_item"><a class="nav__link" href="{{ path('prez') }}">Qui sommes-nous ?</a></li>
+ <li class="nav__list_item"><a class="nav__link" href="{{ path('connexion') }}">Se connecter</a></li>
+ </ul>
+ </nav>
+</div> #}
+ <body>
+ <section class="section-BigTitle">
+ <div class="logo">
+ {% block titre %}
+
+ {% endblock %}
+ </div>
+ <aside id="circle-menu">
+ <div class="circle-menu"></div>
+ </aside>
+ </section>
+ <main>
{% block main %}
{% endblock %}
@@ -79,12 +100,12 @@
<p>Futur site trop stylé</p> #}
<footer>
- <div class="footer-div1">
- <div><a href="{{ path('home') }}"><img src="{{ asset('image/logo-blanc.png') }}" alt=""></a></div>
- <div class="order-title"><a href="{{ path('app_parcours_index') }}">Parcours</a></div>
- <div><a href="{{ path('app_oeuvre_index') }}">Oeuvres</a></div>
- </div>
- <li><a href="">Qui sommes-nous ?</a></li>
+ <div class="footer-div1">
+ <div><a href="{{ path('home') }}"><img src="{{ asset('image/logo-blanc.png') }}" alt=""></a></div>
+ <div class="order-title"><a href="{{ path('app_parcours_index') }}">Nos parcours</a></div>
+ <div><a href="{{ path('app_oeuvre_index') }}">Les oeuvres</a></div>
+ </div>
+ <li><a href="">Qui sommes-nous ?</a></li>
<div class="footer-div2">
<div><a href="{{ path('mentions') }}">Mentions légales</a></div>
@@ -94,6 +115,7 @@
</footer>
<script src="{{ asset('js/base.js') }}"></script>
-</body>
-
+ {% block script %}
+ {% endblock %}
+ </body>
</html>
diff --git a/templates/home.html.twig b/templates/home.html.twig
index 7a6440c5453152c06aaab9562bee03c483ca429e..7865e8839796a13b92dbb4d02a62a723f912f640 100644
--- a/templates/home.html.twig
+++ b/templates/home.html.twig
@@ -1,10 +1,16 @@
{% extends 'base.html.twig' %}
+{% block title %}Accueil{% endblock %}
+
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('css/accueil.css') }}">
{% endblock %}
- {% block javascripts %}
+{% block titre %}
+<a href="index.html"><img src="{{ asset('image/logo-noir.png') }}"alt="logo Itiner'art"></a>
+{% endblock %}
+
+{% block javascripts %}
<script src="{{ asset('js/accueil.js') }} " defer></script>
{% endblock %}
@@ -14,7 +20,8 @@
<a href="index.html"><img src="{{ asset('image/logo-noir.png') }}"alt=""></a>
</div>
<aside id="circle-menu">
- <div class="circle-menu"></div>
+ <div class="circle-menu"></div>
+ <div class="circle-menu"></div>
</aside>
</section> #}
diff --git a/templates/oeuvre/index.html.twig b/templates/oeuvre/index.html.twig
index 5a9422c75eb6f934ddb7aeb49317259e4e4c28c3..50077f227400c8249affe60035f60d16f3bebe76 100644
--- a/templates/oeuvre/index.html.twig
+++ b/templates/oeuvre/index.html.twig
@@ -1,12 +1,16 @@
{% extends 'base.html.twig' %}
-{% block title %}Oeuvre index{% endblock %}
+{% block title %}Les oeuvres{% endblock %}
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('css/oeuvres.css') }}">
<script type="text/javascript" src="{{ asset('js/oeuvres.js') }}" defer></script>
{% endblock %}
+{% block titre %}
+<h1>Les oeuvres</h1>
+{% endblock %}
+
{% block main %}
<!--<table class="table">
@@ -33,7 +37,7 @@
<p class="description">Venez découvrir les nombreuses œuvres de nos parcours. Ces Street Art ont été réalisé par des artistes passionnés et dévoués à un monde plus coloré, plus vivant. Plongez dans Strasbourg, à travers des peintures, des collages, des fresques, des graffitis... Ils ont dynamisé la vie dans cette capitale européenne. Apprenez à lever les yeux lors de vos balades quotidiennes et pénétrez dans un nouveau monde.</p>
<div class="decouv">
<h4>Découvrez nos parcours</h4>
- <i class="bi bi-arrow-right-circle"></i>
+ <a href="{{ path('app_parcours_index') }}"><i class="bi bi-arrow-right-circle"></i></a>
</div>
</section>
<div class="bg">
diff --git a/templates/parcour.html.twig b/templates/parcour.html.twig
deleted file mode 100644
index 1ce545a1a38f44cf7abe8bb494bce899e81d87c1..0000000000000000000000000000000000000000
--- a/templates/parcour.html.twig
+++ /dev/null
@@ -1,116 +0,0 @@
-{% extends 'base.html.twig' %}
-{% block stylesheets %}
-<link rel="stylesheet" href="{{ asset('css/parcour.css') }}">
-{% endblock %}
-
-{% block main %}
-<h1>{{ titre }}</h1>
-<section class="parcours_intro">
- <p class="note_parc">Note des visiteurs : 2,5/5 ★</p>
- <p>Jorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac aliquet
- odio mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
- Curabitur tempus urna at turpis condimentum lobortis.</p>
-
- <h2>N’attendez plus, suivez nos pas !</h2>
-</section>
-
-<section class="parcour_prez">
- <div class='cadre' id="carte"></div>
-</section>
-<section class="oeuvres">
- <div class="caroussel">
- <img id="image" src="">
-
- <div class="buttons">
- <button id="before"><i class="bi bi-chevron-left"></i></button>
-
- <button id="after"><i class="bi bi-chevron-right"></i></button>
- </div>
- <div class="info">
- <h2>Oeuvres titre</h2>
- <h3>Par artiste</h3>
- <p class="desc">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ullamcorper orci
- pharetra
- convallis tristique. Sed ac hendrerit ligula, ut maximus diam. Morbi mauris erat, elementum in
- fringilla
- ac, vestibulum lacinia velit. Sed ornare gravida mi eu interdum. Maecenas sit amet sollicitudin sem,
- in
- malesuada urna. Curabitur facilisis vitae odio vitae ullamcorper. Donec quam tellus, fermentum vitae
- nulla ac, sodales egestas orci. Phasellus pretium elit vitae mauris rutrum ullamcorper. Sed eu
- mauris
- scelerisque, malesuada odio non, accumsan augue. Cras vel orci in felis dapibus fermentum ac sit
- amet
- purus. Etiam feugiat diam at eros volutpat, at congue enim convallis. </p>
- <div class="adresse_parc">
- <i class="bi bi-geo-alt-fill"></i>
- <a href="https://goo.gl/maps/xJ8abDynu1B3LsJH9">Adresse de l'oeuvre</a>
- </div>
- </div>
-
- </div>
-</section>
-
-
-
-<section class="commentaire_parc">
- <h2>Commentaires</h2>
-
- <div class="connexion">
- <div class="connectez">
- <p><i>Vous voulez laissez un avis ?</i></p>
- <a href="#">Connectez-vous !</a>
- </div>
- <div class="inscrivez">
- <p><i>Vous n'avez pas de compte ?</i></p>
- <a href="#">Inscrivez-vous !</a>
- </div>
- </div>
- <div class="formulaire">
- <form action="#">
- <div class="test">
- <p>De : pseudo</p>
- <div>
- <label for="select-note">Note de :</label>
- <select name="note" id="select-note">
- <option value="">--Choisssez une option--</option>
- <option value="0">0</option>
- <option value="1">1</option>
- <option value="2">2</option>
- <option value="3">3</option>
- <option value="4">4</option>
- <option value="5">5</option>
- </select>
- <span>★</span>
- </div>
- </div>
- <div class="test2">
- <textarea></textarea>
- <input type="submit" value="Envoyer">
- </div>
- </form>
- </div>
-
- <div class="commentaire_show">
- <div class="comment_pseu">
- <p>De : pseudo</p>
- <p>Note : 2/5 ★</p>
- </div>
- <div class="comment_txt">
- <p>Gorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac
- aliquet
- odio mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos
- himenaeos.
- Gorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac
- aliquet
- odio mattis. </p>
- </div>
- </div>
-
-
-</section>
-<script src="{{ asset('js/parc.js') }}"></script>
-<script async defer
- src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAoEhsbrYlLG5Wcm7fNmnW6NuUcjszHT3Q&callback=initMap">
-</script>
-
-{% endblock %}
\ No newline at end of file
diff --git a/templates/parcours.html.twig b/templates/parcours.html.twig
deleted file mode 100644
index a85368f0396b752aeac16b9bbec9014b8e038792..0000000000000000000000000000000000000000
--- a/templates/parcours.html.twig
+++ /dev/null
@@ -1,64 +0,0 @@
-{% extends 'base.html.twig' %}
-
-{% block stylesheets %}
-<link rel="stylesheet" href="{{ asset('css/parcours.css') }}">
-{% endblock %}
-
-{% block main %}
- <h1>{{ titre }}</h1>
- <section class="intro">
- <div class="brush">
- <img src="{{ asset('image/brush.png') }}" alt="">
- </div>
- <div class="center">
- <p>Plongez dans le cœur de Strasbourg, à travers ses rues décorées par des artistes passionnés. Ces parcours, plus ou moins long, vous sont proposés avec amour par notre fine équipe.</p>
- <h2>N'attendez plus, suivez nos pas !</h2>
- </div>
- <div class="border">
- <img src="{{ asset('image/brush2.png') }}" alt="">
- </div>
- </section>
-
- <section class="parcours">
- <div class="carte">
- <p class="fond">Quartier <br>de la gare</p>
- <p class="note">2,5/5 ★</p>
- </div>
- </div>
- <div class="carte">
- <p class="fond">Quartier <br>de la gare</p>
- <p class="note">2,5/5 ★</p>
- </div>
- </div>
- <div class="carte">
- <p class="fond">Quartier <br>de la gare</p>
- <p class="note">2,5/5 ★</p>
- </div>
- </div>
- <div class="carte">
- <p class="fond">Quartier <br>de la gare</p>
- <p class="note">2,5/5 ★</p>
- </div>
- </div>
- <div class="carte">
- <p class="fond">Quartier <br>de la gare</p>
- <p class="note">2,5/5 ★</p>
- </div>
- </div>
- <div class="carte">
- <p class="fond">Quartier <br>de la gare</p>
- <p class="note">2,5/5 ★</p>
- </div>
- </div>
- <div class="carte">
- <p class="fond">Quartier <br>de la gare</p>
- <p class="note">2,5/5 ★</p>
- </div>
- </div>
- <div class="carte">
- <p class="fond">Quartier <br>de la gare</p>
- <p class="note">2,5/5 ★</p>
- </div>
- </div>
- </section>
-{% endblock %}
\ No newline at end of file
diff --git a/templates/parcours/index.html.twig b/templates/parcours/index.html.twig
index 4e71306c48f594ee24e31c71b3185880eac425fd..9a56e5c0aa1fa13a07dd9cda961f6afa42e2d415 100644
--- a/templates/parcours/index.html.twig
+++ b/templates/parcours/index.html.twig
@@ -7,6 +7,10 @@
<script type="text/javascript" src="{{ asset('js/parcours.js') }}" defer></script>
{% endblock %}
+{% block titre %}
+<h1>Nos Parcours</h1>
+{% endblock %}
+
{% block main %}
<table class="table">
<tbody>
diff --git a/templates/parcours/show.html.twig b/templates/parcours/show.html.twig
index d0e2667ae6e53822b9f05549a3fe671aab6a06d0..17999c24300294b4b1a92ebc8bca297144b0555d 100644
--- a/templates/parcours/show.html.twig
+++ b/templates/parcours/show.html.twig
@@ -1,60 +1,79 @@
{% extends 'base.html.twig' %}
-{% block title %}Parcours{% endblock %}
+{% block title %}{{parcour.nom}}{% endblock %}
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('css/parcour.css') }}">
+<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css" />
+
+{% endblock %}
+
+{% block titre %}
+<h1>{{parcour.nom}}</h1>
{% endblock %}
{% block main %}
-<h1>Parcours</h1
-<section class="parcours_intro">
- <p class="note_parc">Note des visiteurs : 2,5/5 ★</p>
- <p>Jorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac aliquet
- odio mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
- Curabitur tempus urna at turpis condimentum lobortis.</p>
+<h1>Parcours</h1>
+
+<table class="table">
+ <tbody>
+ <tr>
+ <th>Id</th>
+ <td>{{ parcour.id }}</td>
+ </tr>
+ <tr>
+ <th>Nom</th>
+ <td>{{ parcour.nom }}</td>
+ </tr>
+ <tr>
+ <th>Description</th>
+ <td>{{ parcour.description }}</td>
+ </tr>
+ </tbody>
+</table>
+
+<a href="{{ path('app_parcours_index') }}">back to list</a>
+
+<a href="{{ path('app_parcours_edit', {'id': parcour.id}) }}">edit</a>
- <h2>N’attendez plus, suivez nos pas !</h2>
+{{ include('parcours/_delete_form.html.twig') }}
+
+
+<!-- version 1.1 -->
+<section class="parcours_intro">
+ <p class="note_parc">Note des visiteurs : 2,5/5 <i class="bi bi-star-fill"></i></p>
+ <p>{{parcour.description}}</p>
+ <h4>N'attendez plus, suivez nos pas !</h4>
</section>
<section class="parcour_prez">
<div class='cadre' id="carte"></div>
</section>
-<section class="oeuvres">
- <div class="caroussel">
- <img id="image" src="">
-
- <div class="buttons">
- <button id="before"><i class="bi bi-chevron-left"></i></button>
- <button id="after"><i class="bi bi-chevron-right"></i></button>
- </div>
- <div class="info">
- <h2>Oeuvres titre</h2>
- <h3>Par artiste</h3>
- <p class="desc">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ullamcorper orci
- pharetra
- convallis tristique. Sed ac hendrerit ligula, ut maximus diam. Morbi mauris erat, elementum in
- fringilla
- ac, vestibulum lacinia velit. Sed ornare gravida mi eu interdum. Maecenas sit amet sollicitudin sem,
- in
- malesuada urna. Curabitur facilisis vitae odio vitae ullamcorper. Donec quam tellus, fermentum vitae
- nulla ac, sodales egestas orci. Phasellus pretium elit vitae mauris rutrum ullamcorper. Sed eu
- mauris
- scelerisque, malesuada odio non, accumsan augue. Cras vel orci in felis dapibus fermentum ac sit
- amet
- purus. Etiam feugiat diam at eros volutpat, at congue enim convallis. </p>
- <div class="adresse_parc">
- <i class="bi bi-geo-alt-fill"></i>
- <a href="https://goo.gl/maps/xJ8abDynu1B3LsJH9">Adresse de l'oeuvre</a>
+<section class="oeuvres">
+ <button class="slick-prev slick-arrow"><i class="bi bi-chevron-left"></i></button>
+ <div class="caroussel slick-slider">
+ {% for oeuvre in oeuvres %}
+ <div class="slick-slide vue">
+ <img class="image" src="{{oeuvre.photo}}" alt="{{oeuvre.altImg}}">
+ <div class="info">
+ <h2>{{oeuvre.nom}}</h2>
+ <h3>{{oeuvre.artiste}}</h3>
+ <p class="desc">
+ {{oeuvre.descriptionO}}
+ </p>
+ <div class="adresse_parc">
+ <i class="bi bi-geo-alt-fill"></i>
+ <p>{{oeuvre.adresse}}</p>
+ </div>
+ </div>
</div>
- </div>
-
+ {% endfor %}
</div>
+ <button class="slick-next slick-arrow"><i class="bi bi-chevron-right"></i></button>
</section>
-
<section class="commentaire_parc">
<h2>Commentaires</h2>
@@ -68,13 +87,10 @@
<a href="#">Inscrivez-vous !</a>
</div>
</div>
-
- {{ parcour.id }}
-
<div class="formulaire">
- <form action="{{ path('app_parcours_send_comment', { id: parcour.id })}}" method="post">
+ <form action="#">
<div class="test">
- <p>De : {{ app.user.pseudo }}</p>
+ <p>De : pseudo</p>
<div>
<label for="select-note">Note de :</label>
<select name="note" id="select-note">
@@ -89,37 +105,43 @@
<span>★</span>
</div>
</div>
- <input type="text" name="titre">
<div class="test2">
- <textarea name="message"></textarea>
+ <textarea></textarea>
<input type="submit" value="Envoyer">
</div>
</form>
</div>
- {% for comment in comments %}
- <div class="commentaire_show">
+ <div class="commentaire_show">
<div class="comment_pseu">
- <p>De : </p>
- <p>{{comment.titre}}</p>
- <p>Note : {{comment.note}}/5 ★</p>
+ <p>De : pseudo</p>
+ <p>Note : 2/5 ★</p>
</div>
<div class="comment_txt">
- <p>{{comment.comment}} </p>
+ <p>Gorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac
+ aliquet
+ odio mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos
+ himenaeos.
+ Gorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac
+ aliquet
+ odio mattis. </p>
</div>
- </div>
- {% endfor %}
+ </div>
</section>
-<script src="{{ asset('js/parc.js') }}"></script>
+
+{% endblock %}
+
+
+{% block script %}
<script async defer
- src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAoEhsbrYlLG5Wcm7fNmnW6NuUcjszHT3Q&callback=initMap">
+ src="{{ asset('https://maps.googleapis.com/maps/api/js?key=AIzaSyAoEhsbrYlLG5Wcm7fNmnW6NuUcjszHT3Q&callback=initMap') }}">
</script>
-<a href="{{ path('app_parcours_index') }}">back to list</a>
-
-<a href="{{ path('app_parcours_edit', {'id': parcour.id}) }}">edit</a>
+<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
+<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
-{{ include('parcours/_delete_form.html.twig') }}
+<script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
+<script src="{{ asset('js/parc.js') }}"></script>
{% endblock %}
\ No newline at end of file
diff --git a/templates/prez.html.twig b/templates/prez.html.twig
index b60733b106f8f670b11d23e9b29e6050860e578e..8ca31359a68f79479ad98fe5fa42a635e3385a2d 100644
--- a/templates/prez.html.twig
+++ b/templates/prez.html.twig
@@ -1,8 +1,15 @@
{% extends 'base.html.twig' %}
+{% block title %}Qui sommes-nous ?{% endblock %}
+
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('css/qui.css') }}">
{% endblock %}
+{% block titre %}
+<h1>Qui sommes-nous ?</h1>
+{% endblock %}
+
+
{% block main %}
<h1>{{ titre }}</h1>