Kaumeet
This commit is contained in:
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 |
|
@ -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,8 +22,9 @@ 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{
|
||||||
|
@ -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);
|
||||||
|
@ -267,3 +272,41 @@ div#slider figure {
|
||||||
}
|
}
|
||||||
|
|
||||||
/*============================================*/
|
/*============================================*/
|
||||||
|
|
||||||
|
/* 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;
|
||||||
|
}
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
26
index.html
26
index.html
|
@ -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,7 +40,7 @@
|
||||||
</figure>
|
</figure>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="content">
|
<div class="title">
|
||||||
<h1>Tous nos produits :</h1>
|
<h1>Tous nos produits :</h1>
|
||||||
</div>
|
</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>
|
||||||
|
|
Reference in a new issue