play.geekify.de/homepage
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Add toggle script for details

Browse source
This commit is contained in:
sqozz 2021-03-24 15:36:49 +01:00
parent 4bc1a909bb
commit 4e86d180a2
3 changed files with 17 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
homepage/html/index.html
View file

@ -11,7 +11,7 @@
<div class="player_count">Players Online: {{player_count}}/{{max_players}}</div> <div class="player_count">Players Online: {{player_count}}/{{max_players}}</div>
<div class="items"> <div class="items">
<div class="row"> <div class="row">
<a class="item news" href="/news"> <a class="item news" onclick="return toggleDetails(this)">
<div class="icon"></div> <div class="icon"></div>
<div class="text">News</div> <div class="text">News</div>
</a> </a>
@ -20,13 +20,13 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<a class="item map" href="https://play.geekify.de"> <a class="item map" href="https://play.geekify.de" target="_blank">
<div class="icon"></div> <div class="icon"></div>
<div class="text">Map</div> <div class="text">Map</div>
</a> </a>
</div> </div>
<div class="row"> <div class="row">
<a class="item whitelist" href="/request"> <a class="item whitelist" id="whitelist" onclick="return toggleDetails(this)">
<div class="icon"></div> <div class="icon"></div>
<div class="text">Request Invite</div> <div class="text">Request Invite</div>
</a> </a>
@ -41,5 +41,6 @@
</div> </div>
</div> </div>
</div> </div>
<script src="/js/index.js"></script>
</body> </body>
</html> </html>

4
homepage/static/css/styles.css
View file

@ -89,7 +89,9 @@ body {
} }
.details { .details {
display: flex; /* Hidden by default */
/*display: flex;*/
display: none;
justify-content: center; justify-content: center;
} }

10
homepage/static/js/index.js Normal file
View file

@ -0,0 +1,10 @@
function toggleDetails(e) {
var parentElement = e.parentElement
var detailsElement = parentElement.querySelector(".details");
if (detailsElement.style.display === "none") {
detailsElement.style.display = "flex";
} else {
detailsElement.style.display = "none";
}
return false;
}