mirror of
https://github.com/helenclx/leilukin-site.git
synced 2025-03-14 23:07:15 +00:00
48 lines
1.1 KiB
Plaintext
48 lines
1.1 KiB
Plaintext
<header class="hero">
|
|
<div class="hero__top-bar hidden"></div>
|
|
<div class="hero__img">
|
|
{% block heroImg %}
|
|
{{ heroImg }}
|
|
{% endblock %}
|
|
</div>
|
|
</header>
|
|
|
|
<style>
|
|
.hero {
|
|
width: 100%;
|
|
background-color: var(--clr-hero-bg);
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
text-align: center;
|
|
}
|
|
|
|
.hero__top-bar {
|
|
background-color: var(--clr-navbar-bg);
|
|
width: 100%;
|
|
padding: 0.5em 0;
|
|
}
|
|
|
|
.hero__img {
|
|
display: grid;
|
|
place-content: center;
|
|
}
|
|
|
|
.hero img {
|
|
object-fit: scale-down;
|
|
overflow: hidden;
|
|
filter: drop-shadow(0.1rem 0.1rem 0.2rem black);
|
|
max-height: 20rem;
|
|
}
|
|
</style>
|
|
|
|
<script defer>
|
|
const hero = document.querySelector(".hero");
|
|
const todayEvent = getTodayEvent();
|
|
const heroTopBarEl = document.querySelector(".hero__top-bar");
|
|
const headerImgEl = document.querySelector(".hero__img");
|
|
|
|
{% block eventScript %}
|
|
{{ eventScript }}
|
|
{% endblock %}
|
|
</script> |