1
0
Fork 0
This commit is contained in:
KEZEL BENOIT p1907091 2019-12-13 13:48:52 +01:00
parent b9e8a248a9
commit e6e4c4ae0d
7 changed files with 83 additions and 18 deletions

Binary file not shown.

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.5 KiB

After

Width:  |  Height:  |  Size: 7.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 218 KiB

After

Width:  |  Height:  |  Size: 211 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 99 KiB

View file

@ -1,4 +1,8 @@
body{ html{
scroll-behavior: smooth;
}
body{
margin: 0; margin: 0;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
background-image: url("Images/bg.jpg"); background-image: url("Images/bg.jpg");
@ -18,14 +22,15 @@ a{
background-color: white; background-color: white;
width: 100%; width: 100%;
z-index: 3; z-index: 3;
overflow: auto; overflow: auto;
box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.1); position: fixed;
} }
.header ul{ .header ul{
margin: 0; margin: 0;
padding : 0; padding : 0;
list-style: none; list-style: none;
overflow: hidden; overflow: hidden;
background-color: white; background-color: white;
} }
@ -209,20 +214,20 @@ div#slider figure {
} }
.flex-container>div>a>p{ .flex-container>div>a>p{
font-size: 0px;
}
.flex-container .ok:hover a>p{
font-size: 40px; font-size: 40px;
transition-duration: 0.2s;
} }
.content{ .flex-container .ok:hover a>img{
width: 100%;
transition-duration: 0.5s;
}
.title{
padding: 5vw 1vw; padding: 5vw 1vw;
background-color: rgba(255, 255, 255, 0.548); background-color: rgba(255, 255, 255, 0.548);
} }
.content>h1{ .title>h1{
font-size: 60px; font-size: 60px;
text-align: center; text-align: center;
color: rgb(0, 0, 0); color: rgb(0, 0, 0);
@ -266,4 +271,42 @@ div#slider figure {
text-align: center; text-align: center;
} }
/*============================================*/ /*============================================*/
/* QUI SOMMES NOUS ?*/
.content {
background-color: rgb(234, 234, 234);
padding: 1vw;
}
#nous table{
width: 100%;
margin-top: 2%;
}
#nous img{
display: block;
margin: auto;
border-radius: 1vw;
width: 30%;
margin-bottom: 3%;
}
#nous h2{
font-size: 40px;
padding-top: 2vw;
margin: 0;
}
#nous h3{
color: rgb(53, 53, 53);
}
#nous td{
text-align: center;
}
#nous ul {
list-style-type: none;
}

View file

@ -1,5 +1,9 @@
@media (min-width:48em){ @media (min-width:750px){
/* NAVBAR */ /* NAVBAR */
.header{
position: fixed;
}
.header li{ .header li{
float: left; float: left;
} }

View file

@ -4,7 +4,7 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Kyflo - hewo</title> <title>Kyflo</title>
<link rel="stylesheet" type="text/css" href="Assets/css.css"> <link rel="stylesheet" type="text/css" href="Assets/css.css">
<link rel="stylesheet" type="text/css" href="Assets/resp.css"> <link rel="stylesheet" type="text/css" href="Assets/resp.css">
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
@ -14,12 +14,12 @@
<body> <body>
<header class="header"> <header class="header">
<a href="/" class="logo">KYFLO</a> <a href="#" class="logo">KYFLO</a>
<input class="menu-btn" type="checkbox" id="menu-btn"/> <input class="menu-btn" type="checkbox" id="menu-btn"/>
<label class="menu-icon" for="menu-btn"><span class="nav-icon"></span></label> <label class="menu-icon" for="menu-btn"><span class="nav-icon"></span></label>
<ul class="menu"> <ul class="menu">
<li><input type="text" placeholder="Rechercher..."></li> <li><input type="text" placeholder="Rechercher..."></li>
<li><a href="#">A propos</a></li> <li><a href="#nous">A propos</a></li>
<li><a href="#">Contact</a></li> <li><a href="#">Contact</a></li>
<li><a href="#">Panier</a></li> <li><a href="#">Panier</a></li>
</ul> </ul>
@ -40,10 +40,10 @@
</figure> </figure>
</div> </div>
<div class="content"> <div class="title">
<h1>Tous nos produits :</h1> <h1>Tous nos produits :</h1>
</div> </div>
<div class="flex-container"> <div class="flex-container">
<div class="ok"><a href="Assets/Pages/Produits/nao.html"><img src="Assets/Images/Produits/nao.png" alt><p>Nao</p></a></div> <div class="ok"><a href="Assets/Pages/Produits/nao.html"><img src="Assets/Images/Produits/nao.png" alt><p>Nao</p></a></div>
<div ><div class="rupt">Rutpure de stock</div><a href="#"><img class="out" src="Assets/Images/Produits/valkyrie.png" alt><p>Valkyrie</p></a></div> <div ><div class="rupt">Rutpure de stock</div><a href="#"><img class="out" src="Assets/Images/Produits/valkyrie.png" alt><p>Valkyrie</p></a></div>
@ -53,7 +53,25 @@
<div class="ok"><a href="Assets/Pages/Produits/r2d2.html"><img src="Assets/Images/Produits/terminator.png" alt><p>Terminator</p></a></div> <div class="ok"><a href="Assets/Pages/Produits/r2d2.html"><img src="Assets/Images/Produits/terminator.png" alt><p>Terminator</p></a></div>
</div> </div>
<div id="nous">
<div class="title">
<h1>Qui sommes nous ?</h1>
</div>
<div class="content">
<h2>L'équipe :</h2>
<table id="equipe">
<tr id="equ">
<td><img src="Assets/Images/Sprites/benoit.png" alt></td>
<td><h2>Nos engagements :</h2><h3>Etre soucieux de la qualité de nos produits</h3><h3>Vendre des robots à la pointe de la technologie</h3><h3>Respecter l'environnement</h3></td>
<td><img src="Assets/Images/Sprites/florian.png" alt></td>
</tr>
</table>
</div>
</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</body> </body>
</html> </html>