This commit is contained in:
nora 2021-06-05 23:35:33 +02:00
commit c484673b2c
4 changed files with 116 additions and 0 deletions

2
.gitignore vendored Normal file
View file

@ -0,0 +1,2 @@
.idea
*.iml

55
index.html Normal file
View file

@ -0,0 +1,55 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="centered">
<h1>Good BDSM Test</h1>
<p>The best BDSM Test on the internet. Find your favourite kink here.</p>
<div id="start">
<p>Click here to start the test</p>
<button onclick="start()">Start the test</button>
</div>
<div id="selection" class="hide">
<p>Select what you like most</p>
<button onclick="selection(this)">Asexual</button>
<button onclick="selection(this)">Vanilla</button>
<button onclick="selection(this)">Switch</button>
<button onclick="selection(this)">Non-monogamist</button>
<button onclick="selection(this)">Submissive</button>
<button onclick="selection(this)">Dominant</button>
<button onclick="selection(this)">Exhibitionist</button>
<button onclick="selection(this)">Experimentalist</button>
<button onclick="selection(this)">Rigger</button>
<button onclick="selection(this)">Owner</button>
<button onclick="selection(this)">Voyeur</button>
<button onclick="selection(this)">Sadist</button>
<button onclick="selection(this)">Primal (Hunter)</button>
<button onclick="selection(this)">Brat tamer</button>
<button onclick="selection(this)">Master/Mistress</button>
<button onclick="selection(this)">Rope bunny</button>
<button onclick="selection(this)">Degrader</button>
<button onclick="selection(this)">Daddy/Mommy</button>
<button onclick="selection(this)">Brat</button>
<button onclick="selection(this)">Pet</button>
<button onclick="selection(this)">Primal (Prey)</button>
<button onclick="selection(this)">Masochist</button>
<button onclick="selection(this)">Slave</button>
<button onclick="selection(this)">Boy/Girl</button>
<button onclick="selection(this)">Degradee</button>
<button onclick="selection(this)">Ageplayer</button>
</div>
<div id="result" class="hide">
<p>Your result is:</p>
<p><b id="result-text"></b></p>
<br/>
<p>Don't like your result?</p>
<button onclick="restart()">Try again</button>
</div>
</div>
<script src="script.js"></script>
</body>
</html>

16
script.js Normal file
View file

@ -0,0 +1,16 @@
function start() {
document.getElementById("start").classList.add("hide");
document.getElementById("selection").classList.remove("hide");
}
function selection(e) {
document.getElementById("selection").classList.add("hide");
document.getElementById("result").classList.remove("hide");
document.getElementById("result-text").innerHTML = e.innerHTML;
}
function restart() {
document.getElementById("start").classList.remove("hide");
document.getElementById("result").classList.add("hide");
}

43
style.css Normal file
View file

@ -0,0 +1,43 @@
html {
font-family: Verdana, sans-serif;
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body {
height: 100%;
background-color: #282c34;
display: flex;
justify-content: center;
flex-direction: column;
color: white;
align-items: center;
text-align: center;
}
button {
height: 50px;
width: 300px;
background-color: #5d6172;
border: none;
margin: 1px;
}
button:hover {
background-color: #a7acbf;
cursor: pointer;
}
.hide {
display: none;
}
.show {
display: block;
}