mod: усилена медитативность

This commit is contained in:
2026-02-18 19:44:06 +03:00
parent b7321220c2
commit 4b9e102887
3 changed files with 41 additions and 7 deletions

View File

@@ -34,11 +34,16 @@
body {
margin: 0;
min-height: 100vh;
background-color: #570000; /* Fallback color */
transition: background 1s ease; /* Плавное появление градиента */
background-color: #111; /* Изначально темный фон */
opacity: 0; /* Скрываем контент до расчета цвета */
transition: opacity 0.9s ease-in-out; /* Очень плавное появление */
}
</style>
<noscript>
<style>body { opacity: 1; }</style>
</noscript>
{% block ExtraHead %}{% endblock %}
</head>
<body>

View File

@@ -81,10 +81,6 @@
</div>
<script type="text/javascript">
setTimeout('location.replace("/{{ NEXT }}_{{ NEXT_TXT }}{% if CURRENT_TAG %}?tag={{ CURRENT_TAG }}{% endif %}")', 15000);
/*Изменить текущий адрес страницы через 3 секунды (3000 миллисекунд)*/
</script>
<noscript>
<meta http-equiv="refresh" content="15; url=/{{ NEXT}}_{{ NEXT_TXT }}{% if CURRENT_TAG %}?tag={{ CURRENT_TAG }}{% endif %}">
</noscript>

View File

@@ -58,5 +58,38 @@ document.addEventListener("DOMContentLoaded", function() {
// Use the first color of the gradient with opacity 0.7
imgBgContainer.style.background = `rgba(${colors[0]}, ${colors[1]}, ${colors[2]}, 0.7)`;
}
// 6. Reveal content (Fade In effect)
setTimeout(() => {
document.body.style.opacity = 1;
}, 50);
// 7. Handle Fade Out on link clicks
document.body.addEventListener('click', function(e) {
// Find if a link was clicked (bubble up)
const link = e.target.closest('a');
if (link && link.href && link.target !== '_blank' && !link.href.startsWith('#') && !link.href.includes('javascript:')) {
// Check if it is an internal link (same domain)
if (new URL(link.href).origin === window.location.origin) {
e.preventDefault(); // Stop immediate navigation
document.body.style.opacity = 0; // Start Fade Out
// Wait for transition (matches CSS transition time 1.5s)
setTimeout(() => {
window.location.href = link.href;
}, 900);
}
}
});
// 8. Auto-redirect ("meditative" slideshow)
// Find the NEXT link and simulate a click on it after 15 seconds
const nextLink = document.querySelector('#next a');
if (nextLink) {
setTimeout(() => {
// Trigger the click event on the link so our handler above (step 7) catches it
// and performs the smooth fade out animation.
nextLink.click();
}, 15000);
}
});