diff --git a/wiki/pages/home.html b/wiki/pages/home.html index d661e646f3cf3cb26bc96f6ff3b16993ca558e52..458de54ac22a1d26066ca431dc1e1d9cafb5bc21 100644 --- a/wiki/pages/home.html +++ b/wiki/pages/home.html @@ -1,10 +1,26 @@ {% extends "layout.html" %} -{% block title %}Home{% endblock %} -{% block lead %}<b>Welcome to iGEM 2024!</b> Your team has been approved and you are ready to start the iGEM season!{% endblock %} +{% block title %}{% endblock %} + +{% block lead %} +<div style="display:flex; justify-content: center;"> + <img id="back-img" src="https://static.igem.wiki/teams/5342/images/infinityf-nobg-circle.webp" alt="InfinityF logo" style="width:auto; height:auto; max-height:50vh; max-width:70vw; z-index:0;"> + <img id="front-img" src="https://static.igem.wiki/teams/5342/images/infinityf-nobg-logos-circle.webp" alt="InfinityF logo" style="width:auto; height:auto; max-height:50vh; max-width:70vw; transition: all 2.5s; z-index:1; opacity:0; position:absolute;"> +</div> +{% endblock %} {% block page_content %} +<style></style> + +<script> + document.addEventListener("scroll", (event) => { + document.getElementById("front-img").style.opacity='1'; + }, {once:true}); +</script> + + +<!-- <div class="row"> <div class="col"> <h2>Before you start</h2> @@ -56,5 +72,5 @@ </ul> </div> </div> - +--> {% endblock %}