toine/partirdezero
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Ajout des décorations et animations de neige pour les fêtes de fin d'année, chargées conditionnellement en décembre.

Browse source
This commit is contained in:
mrtoine 2025-12-16 13:10:43 +01:00
parent e1f8a23f3d
commit 91f7f79546
4 changed files with 48 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

26
static/js/functions.js
View file

@ -94,28 +94,4 @@ document.addEventListener('DOMContentLoaded', function() {
}); });
} }
} catch(e) {} } catch(e) {}
}); });
// Fonction pour générer des flocons de neige
function createSnowflake() {
const snowflake = document.createElement('div');
snowflake.classList.add('snowflake');
snowflake.textContent = '•';
snowflake.style.left = `${Math.random() * 100}vw`;
const size = Math.random() * 1.5 + 0.5;
snowflake.style.fontSize = `${size}em`;
const duration = Math.random() * 5 + 5;
snowflake.style.animationDuration = `${duration}s`;
document.body.appendChild(snowflake);
setTimeout(() => {
snowflake.remove();
}, duration * 1000);
}
// On génère les flocons toutes les 300ms
setInterval(createSnowflake, 300);

36
templates/layout.html
View file

@ -31,6 +31,37 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="shortcut icon" type="image/x-icon" href="{% static 'favicon.ico' %}"> <link rel="shortcut icon" type="image/x-icon" href="{% static 'favicon.ico' %}">
{% now "n" as month %}
{% if month == '12' %}
<!-- Décorations de Noël (chargées uniquement en décembre) -->
<link rel="stylesheet" href="{% static 'css/christmas.css' %}">
<script>
// Fonction pour générer des flocons de neige
function createSnowflake() {
const snowflake = document.createElement('div');
snowflake.classList.add('snowflake');
snowflake.textContent = '•';
snowflake.style.left = `${Math.random() * 100}vw`;
const size = Math.random() * 1.5 + 0.5;
snowflake.style.fontSize = `${size}em`;
const duration = Math.random() * 5 + 5;
snowflake.style.animationDuration = `${duration}s`;
document.body.appendChild(snowflake);
setTimeout(() => {
snowflake.remove();
}, duration * 1000);
}
// On génère les flocons toutes les 300ms
setInterval(createSnowflake, 300);
</script>
{% endif %}
{% block extra_head %}{% endblock %} {% block extra_head %}{% endblock %}
<script src="{% static 'js/functions.js' %}" defer></script> <script src="{% static 'js/functions.js' %}" defer></script>
@ -53,6 +84,11 @@
<script defer>hljs.highlightAll();</script> <script defer>hljs.highlightAll();</script>
</head> </head>
<body> <body>
{% now "n" as month %}
{% if month == '12' %}
<!-- Overlay neige discret, non interactif -->
<div class="pdz-snow" aria-hidden="true"></div>
{% endif %}
{% block header %} {% block header %}
{% include "partials/_header.html" %} {% include "partials/_header.html" %}
{% endblock %} {% endblock %}

6
templates/partials/_footer.html
View file

@ -1,4 +1,5 @@
<footer class="site-footer"> {% now "n" as month %}
<footer class="site-footer{% if month == '12' %} pdz-xmas{% endif %}">
<div class="footer-columns"> <div class="footer-columns">
<div class="about"> <div class="about">
<h5>À propos</h5> <h5>À propos</h5>
@ -35,5 +36,8 @@
<span>Partir de Zero ©2024 - {% now "Y" %}</span> <span>Partir de Zero ©2024 - {% now "Y" %}</span>
<span>v{{ SITE_VERSION }}</span> <span>v{{ SITE_VERSION }}</span>
<span>Site fièrement créer par <a href="https://av-interactive.be" target="_blank" rel="noopener">AV Interactive</a></span> <span>Site fièrement créer par <a href="https://av-interactive.be" target="_blank" rel="noopener">AV Interactive</a></span>
{% if month == '12' %}
<span class="pdz-holiday-greeting" aria-label="Joyeuses fêtes">Joyeuses fêtes <span class="pdz-festive-emoji" role="img" aria-hidden="true">🎄</span></span>
{% endif %}
</div> </div>
</footer> </footer>

7
templates/partials/_header.html
View file

@ -2,7 +2,12 @@
<div class="brand"> <div class="brand">
<div class="brand-title"> <div class="brand-title">
{% if settings.site_logo %}<img src="{{ settings.site_logo.url }}" alt="{{ settings.site_name|default:'Logo' }}" class="logo" style="max-height:64px; height:auto; vertical-align:middle;">{% endif %} {% if settings.site_logo %}<img src="{{ settings.site_logo.url }}" alt="{{ settings.site_name|default:'Logo' }}" class="logo" style="max-height:64px; height:auto; vertical-align:middle;">{% endif %}
<span class="site-title">Partir de zéro</span> <span class="site-title">Partir de zéro
{% now "n" as month %}
{% if month == '12' %}
<span class="pdz-festive-emoji" aria-hidden="true" title="Joyeuses fêtes">🎄</span>
{% endif %}
</span>
</div> </div>
<span class="subtitle comment">/* Anthony Violet */</span> <span class="subtitle comment">/* Anthony Violet */</span>
</div> </div>