[DESIGN] - Redesigns des boutons

master
frperalde 4 years ago
parent 4cbd564f56
commit 3209391ab2

@ -9,6 +9,18 @@
display: flex; display: flex;
} }
/*Partie Menu du haut*/
.menu{
align-items: center;
justify-content: center;
}
.divmenu {
width: 10vw;
height: inherit;
margin-right: 1vw;
}
.retourstp { .retourstp {
position: absolute; position: absolute;
} }
@ -19,23 +31,19 @@
} }
#affPoints { #affPoints {
position: absolute;
text-align: center; text-align: center;
font-family: Montserrat, impact, Arial Black; font-family: Montserrat, impact, Arial Black;
font-size: 2.5vw; font-size: 2vw;
margin-top: 1%; margin-top: 1.2vw;
margin-left: 28vw;
color: var(--lightsedonca); color: var(--lightsedonca);
} }
#affSolution { #affSolution {
position: absolute;
text-align: center; text-align: center;
font-family: Montserrat, impact, Arial Black; font-family: Montserrat, impact, Arial Black;
font-size: 2.5vw; font-size: 2.5vw;
margin-top: 40vw;
margin-left: 14vw;
color: var(--lightsedonca); color: var(--lightsedonca);
width: inherit;
} }
#textjouer2 { #textjouer2 {

@ -8,9 +8,30 @@
/*===========================================*/ /*===========================================*/
.logoboutton{
font-size: 2vw;
color: var(--lightprima);
margin: 0.25vw;
}
/*Externe*/ /*Externe*/
.bouttonMenuHaut{
height: 4vw;
width: 4vw;
background-color: var(--lightsedonca);
border-radius: 50%;
margin: 0 auto;
margin-top: 0.45vw;
position: relative;
display: block;
}
.containButtonForm{
height: 2.5vw;
width: 2.5vw;
margin: 0.75vw;
position: absolute;
}
.buttonretour { .buttonretour {
position: relative; position: relative;
@ -52,15 +73,14 @@
overflow-x: auto; overflow-x: auto;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
padding-left: 5%;
padding-top: 7vw; padding-top: 7vw;
justify-content: center;
} }
.logop2 img { .logop2 img {
width: 20vh; width: 20vh;
padding-top: 1vh; padding-top: 1vh;
position: relative; position: relative;
left: 43.5vw;
} }

@ -16,7 +16,8 @@
<script type="text/javascript" src="js/main.js"></script> <script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript" src="js/menu.js"></script> <script type="text/javascript" src="js/menu.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@simonwep/pickr/dist/pickr.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.1/css/all.min.css" />
<script src="https://use.fontawesome.com/releases/v5.7.2/css/all.css"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head> </head>
<body onload="settingOpen()"> <body onload="settingOpen()">
@ -611,55 +612,57 @@
</div> </div>
<div id="pageGame"> <div id="pageGame">
<div class="menuhaut"> <div class="menuhaut menu">
<div id="Redistribution"> <div class="divmenu"></div>
<a onclick="redistribuer()" id="relancerbtn">
<div id="contourbuttonvalider"> <div class="divmenu">
<div class="bouttonvalider violet"> <a onclick="retour()" class="bouttonMenuHaut">
<h1 id="textjouer2">RELANCER</h1> <div class="containButtonForm">
</div> <i class="fa fa-arrow-left logoboutton"></i>
</div> </div>
</a> </a>
</div> </div>
<div>
<p id="affSolution"></p> <div class="divmenu">
</div>
<div>
<p id="affPoints">Score : 0</p> <p id="affPoints">Score : 0</p>
</div> </div>
<div id="Redistribution2">
<a id="relancerbtn" onclick="testPourJeuClassique()"> <div class="divmenu logop2">
<div id="contourbuttonvalider">
<div class="bouttonvalider vert">
<h1 id="textjouer2">VALIDER</h1>
</div>
</div>
</a>
</div>
<div id="Redistribution3">
<a id="relancerbtn" onclick="chercheCombi2()">
<div id="contourbuttonvalider">
<div class="bouttonvalider vert">
<h1 id="textjouer2">CHERCHER</h1>
</div>
</div>
</a>
</div>
<div class="logop2">
<a onclick="journuit()"> <a onclick="journuit()">
<img src="imgs/swishjour.png" id="imglogo2"> <img src="imgs/swishjour.png" id="imglogo2">
</a> </a>
</div> </div>
<a class="retourstp" onclick="retour()"> <div class="divmenu">
<div class="buttonretour"> <a onclick="redistribuer()" class="bouttonMenuHaut">
<h1 class="txt">X</h1> <div class="containButtonForm">
</div> <i class="fa fa-redo logoboutton"></i>
</a> </div>
</div> </a>
</div>
<div class="divmenu">
<a class="bouttonMenuHaut" onclick="chercheCombi2()">
<div class="containButtonForm">
<i class="fas fa-search logoboutton"></i>
</div>
</a>
</div>
<div class="divmenu">
<a onclick="testPourJeuClassique()" id="relancerbtn" class="bouttonMenuHaut">
<div class="containButtonForm">
<i class="fa fa-check logoboutton"></i>
</div>
</a>
</div>
</div>
<div id="containcards" class="containcards"> <div id="containcards" class="containcards">
</div> </div>
<div>
<p id="affSolution"></p>
</div>
</div> </div>
</body> </body>

Loading…
Cancel
Save