Modifs taille écran : OK
This commit is contained in:
parent
2387872168
commit
a05c31e770
2 changed files with 27 additions and 14 deletions
|
@ -16,15 +16,16 @@ body {
|
|||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
height:15vh;
|
||||
z-index:0;
|
||||
}
|
||||
h1 {
|
||||
font-size: 4vw;
|
||||
font-size: min(4vw,7vh);
|
||||
margin-bottom:0.5vw;
|
||||
}
|
||||
|
||||
header a {
|
||||
font-size: min(1vw,1.7vh);
|
||||
text-decoration: none;
|
||||
color: #494949;
|
||||
}
|
||||
|
@ -35,7 +36,7 @@ body {
|
|||
|
||||
#main {
|
||||
display: flex;
|
||||
flex: 4;
|
||||
height:65vh;
|
||||
}
|
||||
|
||||
#content {
|
||||
|
@ -48,7 +49,7 @@ body {
|
|||
#text {
|
||||
margin-top:4vh;
|
||||
font-family: 'Special Elite', cursive;
|
||||
font-size: 1.8vw;
|
||||
font-size: min(1.8vw,3.6vh);
|
||||
text-align: center;
|
||||
color: white;
|
||||
cursor:default;
|
||||
|
@ -90,7 +91,7 @@ body {
|
|||
color:#086CA5;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
font-size: 1.8vw;
|
||||
font-size: min(1.8vw,3.6vh);
|
||||
font-family: 'Special Elite', cursive;
|
||||
background:black;
|
||||
border:none;
|
||||
|
@ -99,9 +100,9 @@ body {
|
|||
background: transparent;
|
||||
background-image: url("../Images/Arrow.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size:1vw;
|
||||
background-size:min(1vw,1.7vh);
|
||||
background-position-x: 0vw;
|
||||
background-position-y: 1vh;
|
||||
background-position-y: min(0.4 vw,1vh);
|
||||
padding-left:1.2vw;
|
||||
}
|
||||
|
||||
|
@ -154,14 +155,16 @@ body {
|
|||
outline: none;
|
||||
border:0.2vw solid #b9b9b9;
|
||||
border-radius: 4vw;
|
||||
min-width: 15vw;
|
||||
width :20vw;
|
||||
width:20vw;
|
||||
padding: 1vw 1.2vw 1vw 1.2vw;
|
||||
color: black;
|
||||
font-family: 'Special Elite', cursive;
|
||||
font-size: 1.5vw;
|
||||
background-image: linear-gradient(to top, black -50%, #BF0909 80%);
|
||||
cursor : pointer;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
|
@ -173,8 +176,18 @@ body {
|
|||
background-image: linear-gradient(to top, #BF0909 20%, black 150%);
|
||||
}
|
||||
|
||||
#link{
|
||||
text-decoration:none;
|
||||
padding:0;
|
||||
|
||||
}
|
||||
|
||||
#link:hover{
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
footer{
|
||||
flex:0.5;
|
||||
height:15vh;
|
||||
display:flex;
|
||||
flex-direction: column;
|
||||
justify-content:flex-end;
|
||||
|
|
|
@ -25,7 +25,7 @@
|
|||
<article id="text">
|
||||
<p class="phrase" id="p1">Il est 21h30. Nous sommes en décembre.</p>
|
||||
<p class="phrase">La nuit est tombée depuis bien longtemps.</p>
|
||||
<p class="phrase">La Lune éclaire la pelouse du R1 alors que vous sortez tout juste de votre réunion du Pôle Huma.</p>
|
||||
<p class="phrase">La Lune éclaire la pelouse du R1 alors que vous <br/> sortez tout juste de votre réunion du Pôle Huma.</p>
|
||||
<p class="phrase" id="select" >Vous ressentez l'envie d'un petit <br/>
|
||||
<select id="boisson">
|
||||
<option selected>...</option>
|
||||
|
@ -38,16 +38,16 @@
|
|||
pour réviser la Thermo.</p>
|
||||
<p class="phrase">Votre écocup rempli de <span class="mot" id="selectedDrink"></span>,</p>
|
||||
<p class="phrase">vous apercevez un étudiant qui se dirige tout droit
|
||||
<p class="phrase">vers le sous sol !</p>
|
||||
<p class="phrase">vers le sous-sol !</p>
|
||||
<p class="phrase">Bizarre à cette heure...</p>
|
||||
<div id="arrowBlock">
|
||||
<p id="space">Press space</p>
|
||||
<p id="space">Press enter</p>
|
||||
<img id="arrow" src="../Images/Lecture.png" alt="Texte suivant"/>
|
||||
</div>
|
||||
</article>
|
||||
<div id="buttons">
|
||||
<button id="safeButton" class="button">Aller dormir, ça fait trop peur</button>
|
||||
<button id="riskyButton" class="button">Le suivre</button>
|
||||
<a id="link" class="button" href="./discretion.html">Le suivre</a>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
|
Loading…
Reference in a new issue