diff --git a/pima/resources/views/profil.blade.php b/pima/resources/views/profil.blade.php
index 95f2eb9420802c6d0c607ff5c4be1f8479073c5e..c76505fc9868cfedc5c37eb64fa131f8b98c51f9 100644
--- a/pima/resources/views/profil.blade.php
+++ b/pima/resources/views/profil.blade.php
@@ -8,15 +8,21 @@ Profil
<!--Header des pages-->
<header>
- <!--Pop le header-->
+ <nav class="topnav">
+ <ul>
+ <li><a href="#coordonnees">Coordonnées</a></li>
+ <li><a href="#liste_outils">Liste d'outils</a></li>
+ <li><a href="#edit">Édition</a></li>
+ </ul>
+ </nav>
</header>
<!--Blabla avant découpe -->
- Ici blablabla
- <hr/>
- <!--Navigation-->
+
+ <!--Navigation-->
+
<section>
- <nav class="side">
+ <nav id="nav" class="side">
<ul>
<li><a href="#coordonnees">Coordonnées</a></li>
<li><a href="#liste_outils">Liste d'outils</a></li>
@@ -29,11 +35,29 @@ Profil
<h1 id="coordonnees">Les coordonnées</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+
+Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+
+Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+
Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
</p>
<h1 id="liste_outils">Les outils</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+
+Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+
+Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+
Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
</p>
<h1 id="edit">Les edit</h1>
@@ -41,6 +65,15 @@ Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. A
Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+
+Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+
+Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam libero arcu, euismod a scelerisque vel, mattis et nisi. Donec vitae libero faucibus, vehicula sapien id, eleifend ligula. Fusce diam est, gravida non velit non, gravida aliquet ligula. Duis efficitur mi id fringilla facilisis. Quisque in sagittis dolor. Suspendisse rhoncus convallis suscipit. Ut aliquet sodales sapien quis fringilla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis sapien ac tellus pharetra, sit amet rhoncus velit fringilla. Vestibulum eget diam nunc. Maecenas eros eros, consectetur id gravida ac, luctus non nunc.
+
Pellentesque ullamcorper massa at sapien fringilla, et lobortis ante bibendum. Aenean dui leo, laoreet in nisi nec, sagittis venenatis velit. Nunc suscipit malesuada finibus. Maecenas pharetra congue aliquet. Nullam eu turpis nulla. Nullam laoreet vehicula ipsum ac convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
<!-- Pop les pages à la suite, IL FAUT METTRE DES TITRES STYLES <h1 id=" . "> avec coordonnees, liste_outils et edit -->
</article>
diff --git a/pima/resources/views/template.blade.php b/pima/resources/views/template.blade.php
index 632172ef67de76e378a2812b99595fd9c1ed0241..348c993c69ca9a24a38256b6ae749e19a899e7b1 100644
--- a/pima/resources/views/template.blade.php
+++ b/pima/resources/views/template.blade.php
@@ -39,6 +39,66 @@ body {
padding: 0px 0px 2px 30px;
}
+
+/* Concerne la barre de navigation de haut de page */
+
+
+.topnav{
+ font-size: 30px;
+ height: 50px;
+ width:100%;
+ position: fixed;
+ margin-bottom: 20px;
+ padding-bottom: 5px;
+ border-bottom: 5px solid grey;
+}
+
+
+.topnav ul {
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+ overflow: hidden;
+ position: fixed;
+ top: 0;
+ width: 100%;
+}
+
+.topnav li {
+ float: right;
+}
+
+.topnav a {
+ color: #f2f2f2;
+ text-align: center;
+ padding: 14px 16px;
+ text-decoration: none;
+ font-size: 17px;
+}
+
+.topnav a:visited{
+ color:white;
+ background-color: #686868;
+ text-decoration: none;
+ padding: 0px 10px 0px 10px;
+}
+
+.topnav a:link{
+ color:white;
+ background-color: #686868;
+ text-decoration: none;
+ padding: 0px 10px 0px 10px;
+}
+
+.topnav a:hover{
+ color:white;
+ background-color: #a8a6a6;
+ text-decoration: none;
+ padding: 0px 10px 0px 10px;
+}
+
+/* Barre de navigation de côté style Profil */
+
nav.side{
font-size: 30px;
float: left;
@@ -46,14 +106,9 @@ nav.side{
padding: 20px;
height: 100px;
margin-right: 20px;
-}
-
-article{
- float: right;
- width: 75%;
- margin-left: 10px;
- padding-left: 15px;
- border-left: 5px solid grey
+ position: fixed;
+ overflow: auto;
+ height:100%;
}
nav.side a:link {
@@ -84,6 +139,17 @@ nav.side a:hover {
text-decoration: none;
padding: 0px 10px 0px 10px;
}
+
+/* Le contenu des pages */
+
+article{
+ float: right;
+ width: 80%;
+ margin-left: 10px;
+ margin-top: 60px;
+ padding-left: 15px;
+ border-left: 5px solid grey
+}
</style>
<title>@yield('titre')</title>
</head>