Add success stamp
This commit is contained in:
parent
90593501e3
commit
ad92779176
5 changed files with 18 additions and 0 deletions
|
@ -4,6 +4,7 @@ function win() {
|
|||
clearTimeout(timeout);
|
||||
document.querySelector(".failure").classList.add("hidden");
|
||||
document.querySelector(".success").classList.remove("hidden");
|
||||
document.querySelector(".success-stamp").classList.remove("hidden");
|
||||
}
|
||||
|
||||
function lose() {
|
||||
|
|
|
@ -28,6 +28,20 @@ main, footer {
|
|||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.success-stamp {
|
||||
position: absolute;
|
||||
top: 250px;
|
||||
left: 20px;
|
||||
font-size: 60px;
|
||||
transform: rotate(-20deg);
|
||||
color: #0f5132;
|
||||
display: inline-block;
|
||||
background-color: #d1e7dd;
|
||||
border: 1px solid #badbcc;
|
||||
padding: .2em .5em;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
@ -37,6 +37,7 @@
|
|||
<area shape="poly" coords="378,226,378,264,441,264,441,316,467,316,468,226" onclick="zone('Zone grise/beige')">
|
||||
<area shape="rect" coords="353,324,443,340" onclick="zone('Ligne bleue')">
|
||||
</map>
|
||||
<span class="success-stamp hidden">FÉLICITATIONS 🎉</span>
|
||||
</p>
|
||||
<p>
|
||||
Couleurs non contractuelles.
|
||||
|
|
|
@ -25,6 +25,7 @@
|
|||
</p>
|
||||
<p class="img-holder">
|
||||
<img src="images/nature.jpg" id="moquette" width="620" height="652" alt="Moquette">
|
||||
<span class="success-stamp hidden">FÉLICITATIONS 🎉</span>
|
||||
</p>
|
||||
</main>
|
||||
<footer>
|
||||
|
|
|
@ -36,6 +36,7 @@
|
|||
<area shape="rect" coords="527,48,585,229" onclick="win()">
|
||||
<area shape="rect" coords="0,0,1260,1292" onclick="lose()">
|
||||
</map>
|
||||
<span class="success-stamp hidden">FÉLICITATIONS 🎉</span>
|
||||
</p>
|
||||
</main>
|
||||
<footer>
|
||||
|
|
Loading…
Reference in a new issue