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,18 +212,8 @@ a:hover {
line-height: 3rem; line-height: 3rem;
top: 0; top: 0;
left: 0; left: 0;
animation: fadeOut 7s forwards;
} }
@keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
.blog-card { .blog-card {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@@ -391,7 +381,7 @@ em {
} }
nav { nav {
margin-top: 1%; margin-top: 3rem;
font-size: 1.6em; font-size: 1.6em;
} }
@@ -431,7 +421,7 @@ nav .nav-btn {
} }
.cta { .cta {
font-size:.9rem; font-size:1.1rem;
line-height: 1.5rem; line-height: 1.5rem;
height: 3.1rem; 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://css/style.css') %}
{% do assets.addCss('theme://fonts/opensans/local.css') %} {% do assets.addCss('theme://fonts/opensans/local.css') %}
{% do assets.addCss('theme://fonts/sourcecodepro/local.css') %} {% do assets.addCss('theme://fonts/sourcecodepro/local.css') %}
{% do assets.addJs('theme://js/cta.js') %}
{% if theme_config.hashover.domain %} {% if theme_config.hashover.domain %}
{% endif %} {% endif %}
{% endblock %} {% endblock %}
{{ assets.css()|raw }} {{ assets.css()|raw }}
{{ assets.js()|raw }}
{{ theme_config.analytics|raw }} {{ theme_config.analytics|raw }}
</head> </head>
<body id="top"{% if page.header.onload %} onload='{{ page.header.onload|raw }}'{% endif %}> <body id="top"{% if page.header.onload %} onload='{{ page.header.onload|raw }}'{% endif %}>
<div class="cta">{% include 'partials/cta.html.twig' %}</div>
{% block header %} {% block header %}
<div class="navigation"> <div class="navigation">
{% block header_navigation %} {% block header_navigation %}

View File

@@ -1,3 +1,3 @@
{# CTA banner content #} {# 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>