Compare commits
3 commits
3bcdf44558
...
2de752322e
Author | SHA1 | Date | |
---|---|---|---|
2de752322e | |||
1ba41e8f5a | |||
a02b4596e9 |
2 changed files with 101 additions and 1 deletions
83
CSS/menu.css
83
CSS/menu.css
|
@ -1,4 +1,87 @@
|
|||
body{
|
||||
background-color: black;
|
||||
height:95vh;
|
||||
color:white;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
justify-content:center;
|
||||
align-items: center;
|
||||
font-family:'Special Elite',cursive;
|
||||
}
|
||||
|
||||
header{
|
||||
flex:1;
|
||||
display:flex;
|
||||
justify-content:center;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
#headerTxt{
|
||||
|
||||
font-size:4.5vw;
|
||||
font-weight: bold;
|
||||
background: -webkit-linear-gradient(#BF0909 0%, #4F0101 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
-webkit-animation: glow 1s ease-in-out infinite alternate;
|
||||
-moz-animation: glow 1s ease-in-out infinite alternate;
|
||||
animation: glow 1s ease-in-out infinite alternate;
|
||||
}
|
||||
|
||||
@-webkit-keyframes glow {
|
||||
from {
|
||||
text-shadow: 0 0 30px #e50022, 0 0 40px #e50022, 0 0 50px #e50022, 0 0 60px #e50022, 0 0 70px #e50022;
|
||||
}
|
||||
|
||||
to {
|
||||
text-shadow: 0 0 30px #e20000, 0 0 40px #e20000, 0 0 50px #e20000, 0 0 60px #e20000, 0 0 70px #e20000, 0 0 80px #e20000, 0 0 90px #e20000;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
main{
|
||||
flex:5;
|
||||
display:flex;
|
||||
justify-content:center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
main section article {
|
||||
display:flex;
|
||||
flex-direction: column;
|
||||
justify-content:center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#introTxt{
|
||||
font-size:2vw;
|
||||
}
|
||||
|
||||
#pseudoTxt{
|
||||
font-size:2vw;
|
||||
}
|
||||
|
||||
#pseudoInput{
|
||||
font-family:'Special Elite',cursive;
|
||||
font-size:1.8vw;
|
||||
border-radius:1vw;
|
||||
padding:0.3vw 0.5vw 0.3vw 0.5vw;
|
||||
}
|
||||
|
||||
#pseudoInput:focus{
|
||||
outline:none;
|
||||
font-family:'Special Elite',cursive;
|
||||
font-size:1.8vw;
|
||||
border-radius:1vw;
|
||||
padding:0.3vw 0.5vw 0.3vw 0.5vw;
|
||||
}
|
||||
|
||||
footer{
|
||||
flex:1;
|
||||
display:flex;
|
||||
flex-direction: column;
|
||||
justify-content:flex-end;
|
||||
align-items: center;
|
||||
}
|
|
@ -5,8 +5,25 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>INSAïde</title>
|
||||
<link rel="stylesheet" href="../CSS/menu.css">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Special+Elite&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
Coucou bonjour
|
||||
<header>
|
||||
<p id="headerTxt">INSAïde</p>
|
||||
</header>
|
||||
<main>
|
||||
<section>
|
||||
<article>
|
||||
<p id="introTxt">Bienvenue, pour commencer l'aventure, veuillez renseigner votre identité</p>
|
||||
<p id="pseudoTxt">Entrez votre pseudo</p>
|
||||
<input id="pseudoInput" type="text"/>
|
||||
</article>
|
||||
</section>
|
||||
</main>
|
||||
<footer>
|
||||
<p id="names">Copyright © 2020 Florian EHR - Pierre FAVARY - Baptiste MARTY</p>
|
||||
<p id="rights">Tous droits réservés </p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in a new issue