| Server IP : 109.234.162.214 / Your IP : 216.73.216.222 Web Server : Apache System : Linux servd162214.srv.odns.fr 4.18.0-372.26.1.lve.1.el8.x86_64 #1 SMP Fri Sep 16 14:08:19 EDT 2022 x86_64 User : carpe ( 1178) PHP Version : 8.0.30 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : OFF | Pkexec : OFF Directory : /home/carpe/public_html/sae 202/V2/ |
Upload File : |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
</head>
<body style="margin: 0">
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<div class="navbar">
<div class="nav-item">
<div class="label"><a href='trash2trend.php'>trash2trend</a></div>
<div class="dropdown">
<a href="trash2trend.php#campagne1">campagne</a>
<a href="trash2trend.php#pistes">pistes</a>
<a href="trash2trend.php#galerie1">galerie</a>
<a href="trash2trend.php#contact1">contact</a>
</div>
</div>
<div class="nav-item">
<div class="label"><a href='campagne.php'>campagne</a></div>
<div class="dropdown">
<a href="campagne.php#bref">en bref</a>
<a href="campagne.php#why">pourquoi</a>
<a href="campagne.php#why">quiz</a>
</div>
</div>
<div class="nav-item">
<div class="label"><a href='galerie.php'>galerie</a></div>
<div class="dropdown">
<a href="galerie.php#affiches">affiches</a>
<a href="galerie.php#video">video</a>
<a href="galerie.php#vintage">vintage</a>
</div>
</div>
<div class="nav-item">
<div class="label"><a href='partenaires.php'>partenaires</a></div>
<div class="dropdown">
<a href="partenaires.php#un">associations</a>
<a href="partenaires.php#deux">marques</a>
<a href="partenaires.php#trois">influenceurs</a>
</div>
</div>
<div class="nav-item2">
<a href="#"><img src="images/YouTube.png" alt="YouTube" /></a>
</div>
<div class="nav-item2">
<a href="#"><img src="images/TikTok.png" alt="TikTok" /></a>
</div>
<div class="nav-item2">
<a href="#"><img src="images/Instagram.png" alt="Instagram" /></a>
</div>
</div>
</body>
<style>
body {
margin: 0;
}
a:link{
color:inherit;
}
a{
text-decoration:none;
}
.label {
display: flex;
font-size: 20px;
text-align: center;
width: 200%;
transform: rotate(-90deg);
position: absolute;
font-size:1.6rem;
font-style:italic;
font-family: "Poppins", sans-serif;
font-weight: 600;
justify-content: center;
height: 80px;
text-decoration: none;
align-items: center;
-webkit-user-select: none; /* Safari */
-ms-user-select: none; /* IE 10 and IE 11 */
user-select: none;
z-index:10;
background-image:url('images/navbar.png');
background-size:cover;
transition:.5s all;
}
.label a{
transition:.5s all;
color:white;
}
.label a:hover{
transform:scale(1.1);
transition:.5s all;
}
a:visited {
color: inherit;
text-decoration: none;
}
.navbar {
position: fixed;
top: 0;
left: 0;
width: 100px;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
padding-top: 10px;
background-image:url('images/navbar.png');
background-size:cover;
background-position:center;
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
z-index:1001;
}
.nav-item {
display: flex;
text-align: center;
color:#f5efe2;
align-items: center;
justify-content: center;
padding: 10px 0;
text-align: center;
width: 100%;
height: 100%;
transform: rotate(90);
position: relative;
left:-10px;
}
.nav-item2 {
display: flex;
text-align: center;
color:#f5efe2;
align-items: center;
justify-content: center;
padding: 10px 0;
text-align: center;
width: 100%;
transform: rotate(90);
position: relative;
}
.nav-item img {
width: 40px;
height: 40px;
}
.nav-item:hover .dropdown {
transform: translateX(0px);
}
.dropdown {
display: flex;
flex-wrap:wrap;
align-items:center;
justify-content:center;
position: absolute;
top: 20px;
left: 80px;
min-width: 160px;
transform: translateX(-500px);
transition: opacity 1s ease, transform 1s ease;
z-index: 0;
background-image:url('images/navbar.png');
background-size:cover;
background-position:center;
border:2px #674F44 solid;
z-index:1;
}
.dropdown a {
font-style:italic;
z-index:0;
color:#f5efe2;
width:100%;
padding: 12px 16px;
text-decoration: none;
display: block;
font-family: "Poppins", sans-serif;
font-weight: 600;
transition:.5s all;
}
.dropdown a:hover {
transform:scale(1.1);
transition:.5s all;
}
img{
border:none;
}
</style>
</html>