final implementation of CTA banner

This commit is contained in:
2024-10-23 16:23:01 +02:00
parent 7a55c71c2f
commit d3af47e722
4 changed files with 23 additions and 13 deletions

View File

@@ -212,16 +212,6 @@ a:hover {
line-height: 3rem;
top: 0;
left: 0;
animation: fadeOut 7s forwards;
}
@keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
.blog-card {
@@ -391,7 +381,7 @@ em {
}
nav {
margin-top: 1%;
margin-top: 3rem;
font-size: 1.6em;
}
@@ -431,7 +421,7 @@ nav .nav-btn {
}
.cta {
font-size:.9rem;
font-size:1.1rem;
line-height: 1.5rem;
height: 3.1rem;
}

16
js/cta.js Normal file
View File

@@ -0,0 +1,16 @@
document.addEventListener("DOMContentLoaded", function() {
const cta = document.querySelector(".cta");
const nav = document.querySelector("nav");
if (cta && nav) {
setTimeout(() => {
cta.style.transition = "height 0.5s ease, opacity 0.5s ease";
cta.style.height = "0";
cta.style.opacity = "0";
setTimeout(() => {
nav.style.setProperty("margin-top", "1%", "important");
}, 500);
}, 10000);
}
});

View File

@@ -83,16 +83,20 @@
{% do assets.addCss('theme://css/style.css') %}
{% do assets.addCss('theme://fonts/opensans/local.css') %}
{% do assets.addCss('theme://fonts/sourcecodepro/local.css') %}
{% do assets.addJs('theme://js/cta.js') %}
{% if theme_config.hashover.domain %}
{% endif %}
{% endblock %}
{{ assets.css()|raw }}
{{ assets.js()|raw }}
{{ theme_config.analytics|raw }}
</head>
<body id="top"{% if page.header.onload %} onload='{{ page.header.onload|raw }}'{% endif %}>
<div class="cta">{% include 'partials/cta.html.twig' %}</div>
{% block header %}
<div class="navigation">
{% block header_navigation %}

View File

@@ -1,3 +1,3 @@
{# CTA banner content #}
Zbiór wszystkich ciekawych linków z newslettera? <a style="color:var(--btn-txt-color)" href="https://newsletter.jozwiak.top/resources/archiwum">Znajdziesz go tutaj</a>
Zbiór wszystkich ciekawych linków z newslettera? <a target="_blank" style="color:var(--btn-txt-color)" href="https://newsletter.jozwiak.top/resources/archiwum">Znajdziesz go tutaj</a>