czsk/czsk
czsk/czsk
9
0
Fork 0
Code Issues 3 Pull requests Projects 1 Packages 1 Wiki Activity Actions

vibing #14

Merged
asxpi merged 17 commits from vibing into main 2026-03-20 12:15:16 +00:00
Conversation 0 Commits 17 Files changed 13 +1501 -1184
13 changed files with 1501 additions and 1184 deletions
Download patch file Download diff file Expand all files Collapse all files

1
Dockerfile
View file

@ -1,6 +1,7 @@
FROM nginx:alpine
COPY --chown=nginx:nginx . /usr/share/nginx/html/
COPY nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80

33
assets/fractal_snowflake.js
View file

@ -27,9 +27,8 @@ var fractalSnowstorm = function(window, document) {
// Если не сезон для снега, не запускаемся
if (!isSnowSeason()) {
console.log('Снегопад активен только с 1 декабря по 31 января. Сейчас не сезон.');
return {
start: function() { console.log('Снегопад доступен только зимой!'); },
start: function() {},
stop: function() {},
isSeason: function() { return false; }
};
@ -572,24 +571,11 @@ var fractalSnowstorm = function(window, document) {
// Публичные методы
const publicAPI = {
start: function() {
if (active) {
console.log('Снегопад уже запущен');
return;
}
if (!isSnowSeason()) {
console.log('Снегопад доступен только с 1 декабря по 31 января');
return;
}
console.log('Запуск зимнего снегопада...', config.isMobile ? '(мобильная версия)' : '(десктоп версия)');
if (active || !isSnowSeason()) return;
targetElement = config.targetElement || document.body;
if (!targetElement) {
console.error('Не могу найти целевой элемент');
return;
}
if (!targetElement) return;
updateScreenSize();
randomizeWind();
@ -608,14 +594,11 @@ var fractalSnowstorm = function(window, document) {
lastTime = 0;
timer = requestAnimationFrame(animate);
console.log(`Снегопад запущен. Снежинок: ${snowflakes.length}, Размер: ${config.flakeWidth}px`);
},
stop: function() {
if (!active) return;
console.log('Остановка снегопада...');
cancelAnimationFrame(timer);
timer = null;
@ -684,15 +667,11 @@ var fractalSnowstorm = function(window, document) {
if (config.autoStart && isSnowSeason()) {
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', () => {
console.log('DOM загружен, запускаю зимний снегопад...');
setTimeout(() => publicAPI.start(), 1000);
});
} else {
console.log('Запускаю зимний снегопад...');
setTimeout(() => publicAPI.start(), 1000);
}
} else if (config.autoStart) {
console.log('Сейчас не сезон для снегопада (только с 1 декабря по 31 января)');
}
return publicAPI;
@ -707,7 +686,6 @@ window.createSimpleSnow = function() {
const now = new Date();
const month = now.getMonth() + 1;
if (!(month === 12 || month === 1 || (month === 2 && now.getDate() === 1))) {
console.log('Простой снегопад доступен только зимой');
return { stop: function() {} };
}
@ -819,8 +797,3 @@ window.createSimpleSnow = function() {
};
// Автоматический запуск простой версии если фрактальная не доступна
if (window.fractalSnowstorm && window.fractalSnowstorm.isSeason && window.fractalSnowstorm.isSeason()) {
console.log('Зимний сезон - снегопад будет запущен автоматически');
} else {
console.log('Сейчас не зимний сезон для снегопада');
}

7
assets/inversion.js
View file

@ -3,12 +3,7 @@ document.addEventListener('DOMContentLoaded', function() {
const hasBackdropFilter = 'backdropFilter' in document.body.style ||
'webkitBackdropFilter' in document.body.style;
if (window.innerWidth <= 768) {
console.log('Мобильное устройство - кастомный курсор отключен');
return;
}
console.log('Инициализация курсора. Поддержка backdrop-filter:', hasBackdropFilter);
if (window.innerWidth <= 768) return;
// Создаем элементы
const cursorOuter = document.createElement('div');

272
assets/main.js Normal file
View file

@ -0,0 +1,272 @@
document.addEventListener("DOMContentLoaded", function () {
var prefersReduced = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
var isDesktop = window.innerWidth > 768;
initYearDisplay();
if (prefersReduced) {
document.querySelectorAll("[data-reveal]").forEach(function (el) {
el.classList.add("revealed");
});
document.querySelectorAll(".photo-card").forEach(function (el) {
el.classList.add("revealed");
});
document.querySelectorAll("main > section").forEach(function (el) {
el.classList.add("in-view");
});
var wtf = document.getElementById("wtf");
if (wtf) wtf.classList.add("visible");
var heading = document.querySelector(".hero-heading");
if (heading) heading.classList.add("shimmer-active");
return;
}
initScrollProgress();
initHeroReveal();
initSectionDissolves();
initRevealAnimations();
initCountUp();
initWtfReveal();
initNavScrollState();
if (isDesktop) {
initPhotoSpotlight();
initHeroParallax();
}
});
function initYearDisplay() {
var el = document.getElementById("current-year");
if (el) el.textContent = new Date().getFullYear();
}
/* --- Scroll progress bar --- */
function initScrollProgress() {
var bar = document.querySelector(".scroll-progress");
if (!bar) return;
var ticking = false;
window.addEventListener("scroll", function () {
if (!ticking) {
requestAnimationFrame(function () {
var scrollTop = window.scrollY;
var docHeight = document.documentElement.scrollHeight - window.innerHeight;
var pct = docHeight > 0 ? (scrollTop / docHeight) * 100 : 0;
bar.style.width = pct + "%";
ticking = false;
});
ticking = true;
}
}, { passive: true });
}
/* --- Hero reveal: scale-down wipe (desktop) / fadeSlideUp (mobile), then shimmer --- */
function initHeroReveal() {
var heading = document.querySelector(".hero-heading");
if (!heading) return;
heading.addEventListener("animationend", function handler(e) {
if (e.animationName === "heroReveal" || e.animationName === "fadeSlideUp") {
heading.classList.add("shimmer-active");
heading.removeEventListener("animationend", handler);
}
});
}
/* --- Section dissolves --- */
function initSectionDissolves() {
var sections = document.querySelectorAll("main > section");
if (!sections.length) return;
// Lower threshold on mobile — sections are taller relative to viewport
var threshold = window.innerWidth > 768 ? 0.1 : 0.05;
var observer = new IntersectionObserver(
function (entries) {
entries.forEach(function (entry) {
if (entry.isIntersecting) {
entry.target.classList.add("in-view");
} else {
entry.target.classList.remove("in-view");
}
});
},
{ threshold: threshold }
);
sections.forEach(function (el) {
observer.observe(el);
});
}
/* --- Reveal animations --- */
function initRevealAnimations() {
var elements = document.querySelectorAll("[data-reveal]");
if (!elements.length) return;
var observer = new IntersectionObserver(
function (entries) {
entries.forEach(function (entry) {
if (entry.isIntersecting) {
entry.target.classList.add("revealed");
observer.unobserve(entry.target);
}
});
},
{ threshold: 0.15 }
);
elements.forEach(function (el) {
observer.observe(el);
});
var cards = document.querySelectorAll(".photo-card[data-reveal]");
cards.forEach(function (card, i) {
card.style.transitionDelay = i * 0.05 + "s";
});
}
/* --- Count-up with scale punch --- */
function initCountUp() {
var counters = document.querySelectorAll("[data-count]");
if (!counters.length) return;
var observer = new IntersectionObserver(
function (entries) {
entries.forEach(function (entry) {
if (entry.isIntersecting) {
animateCount(entry.target);
observer.unobserve(entry.target);
}
});
},
{ threshold: 0.5 }
);
counters.forEach(function (el) {
observer.observe(el);
});
}
function animateCount(el) {
var target = parseInt(el.getAttribute("data-count"), 10);
var suffix = el.getAttribute("data-suffix") || "";
var duration = 1200;
var start = performance.now();
var numberDiv = el.closest(".number");
function easeOutCubic(t) {
return 1 - Math.pow(1 - t, 3);
}
function update(now) {
var elapsed = now - start;
var progress = Math.min(elapsed / duration, 1);
var eased = easeOutCubic(progress);
var current = Math.round(eased * target);
el.textContent = String(current).padStart(2, "0") + suffix;
// Scale punch — peaks at midpoint
var scaleFactor = 1 + 0.15 * Math.sin(progress * Math.PI);
if (numberDiv) {
numberDiv.querySelector("h2").style.transform = "scale(" + scaleFactor + ")";
}
if (progress < 1) {
requestAnimationFrame(update);
} else if (numberDiv) {
numberDiv.querySelector("h2").style.transform = "scale(1)";
}
}
requestAnimationFrame(update);
}
/* --- WTF reveal --- */
function initWtfReveal() {
var wtf = document.getElementById("wtf");
if (!wtf) return;
var observer = new IntersectionObserver(
function (entries) {
entries.forEach(function (entry) {
if (entry.isIntersecting) {
wtf.classList.add("visible");
observer.unobserve(wtf);
}
});
},
{ threshold: 0.3 }
);
observer.observe(wtf);
}
/* --- Nav scroll state --- */
function initNavScrollState() {
var nav = document.getElementById("nav-section");
if (!nav) return;
var ticking = false;
window.addEventListener("scroll", function () {
if (!ticking) {
requestAnimationFrame(function () {
if (window.scrollY > 100) {
nav.classList.add("scrolled");
} else {
nav.classList.remove("scrolled");
}
ticking = false;
});
ticking = true;
}
}, { passive: true });
}
/* --- Photo spotlight (desktop only) --- */
function initPhotoSpotlight() {
var containers = document.querySelectorAll(".photo-container");
containers.forEach(function (container) {
container.addEventListener("mousemove", function (e) {
var rect = container.getBoundingClientRect();
var x = ((e.clientX - rect.left) / rect.width * 100).toFixed(1) + "%";
var y = ((e.clientY - rect.top) / rect.height * 100).toFixed(1) + "%";
container.style.setProperty("--spot-x", x);
container.style.setProperty("--spot-y", y);
});
});
}
/* --- Hero parallax (desktop only) --- */
function initHeroParallax() {
var tit1 = document.querySelector(".tit1");
var heading = document.querySelector(".hero-heading");
var tit2 = document.querySelector(".tit2");
if (!tit1 || !heading || !tit2) return;
var ready = false;
// Wait for hero reveal to finish before starting parallax
heading.addEventListener("animationend", function handler(e) {
if (e.animationName === "heroReveal") {
ready = true;
heading.removeEventListener("animationend", handler);
}
});
var ticking = false;
window.addEventListener("scroll", function () {
if (!ready || ticking) return;
ticking = true;
requestAnimationFrame(function () {
var scrollY = window.scrollY;
var heroH = window.innerHeight;
ticking = false;
if (scrollY > heroH) return;
tit1.style.transform = "translateY(" + (scrollY * 0.15) + "px)";
heading.style.transform = "translateY(" + (scrollY * 0.08) + "px)";
tit2.style.transform = "translateY(" + (scrollY * 0.2) + "px)";
});
}, { passive: true });
}

582
assets/snowflake.js
View file

@ -1,582 +0,0 @@
/** @license
DHTML Snowstorm! JavaScript-based snow for web pages
Making it snow on the internets since 2003. You're welcome.
-----------------------------------------------------------
Version 1.44.20131208 (Previous rev: 1.44.20131125)
Copyright (c) 2007, Scott Schiller. All rights reserved.
Code provided under the BSD License
http://schillmania.com/projects/snowstorm/license.txt
*/
var snowStorm = function(g, f) {
function k(a, d) {
isNaN(d) && (d = 0);
return Math.random() * a + d;
}
function x() {
g.setTimeout(function() {
a.start(!0);
}, 20);
a.events.remove(m ? f : g, "mousemove", x);
}
function y() {
(!a.excludeMobile || !D) && x();
a.events.remove(g, "load", y);
}
// Конфигурация по умолчанию
this.excludeMobile = this.autoStart = !0;
this.flakesMax = 128;
this.flakesMaxActive = 64;
this.animationInterval = 33;
this.useGPU = !0;
this.className = null;
this.excludeMobile = !0;
this.flakeBottom = null;
this.followMouse = !0;
this.snowColor = "#fff";
this.snowCharacter = "&bull;";
this.snowStick = !0;
this.targetElement = null;
this.useMeltEffect = !0;
this.usePixelPosition = this.usePositionFixed = this.useTwinkleEffect = !1;
this.freezeOnBlur = !0;
this.flakeRightOffset = this.flakeLeftOffset = 0;
this.flakeHeight = this.flakeWidth = 8;
this.vMaxX = 5;
this.vMaxY = 4;
this.zIndex = 0;
var a = this,
q, m = navigator.userAgent.match(/msie/i),
E = navigator.userAgent.match(/msie 6/i),
D = navigator.userAgent.match(/mobile|opera m(ob|in)/i),
r = m && "BackCompat" === f.compatMode || E,
h = null,
n = null,
l = null,
p = null,
s = null,
z = null,
A = null,
v = 1,
t = !1,
w = !1,
u;
// Проверка поддержки opacity
a: {
try {
f.createElement("div").style.opacity = "0.5";
} catch (F) {
u = !1;
break a;
}
u = !0;
}
var B = !1,
C = f.createDocumentFragment();
// Инициализация requestAnimationFrame
q = function() {
function c(b) {
g.setTimeout(b, 1E3 / (a.animationInterval || 20));
}
function d(a) {
return void 0 !== h.style[a] ? a : null;
}
var e,
b = g.requestAnimationFrame ||
g.webkitRequestAnimationFrame ||
g.mozRequestAnimationFrame ||
g.oRequestAnimationFrame ||
g.msRequestAnimationFrame ||
c;
e = b ? function() {
return b.apply(g, arguments);
} : null;
var h = f.createElement("div");
e = {
transform: {
ie: d("-ms-transform"),
moz: d("MozTransform"),
opera: d("OTransform"),
webkit: d("webkitTransform"),
w3: d("transform"),
prop: null
},
getAnimationFrame: e
};
e.transform.prop = e.transform.w3 ||
e.transform.moz ||
e.transform.webkit ||
e.transform.ie ||
e.transform.opera;
h = null;
return e;
}();
// Основные свойства
this.timer = null;
this.flakes = [];
this.active = this.disabled = !1;
this.meltFrameCount = 20;
this.meltFrames = [];
// Методы
this.setXY = function(c, d, e) {
if (!c) return !1;
if (a.usePixelPosition || w) {
c.style.left = d - a.flakeWidth + "px";
c.style.top = e - a.flakeHeight + "px";
} else if (r) {
c.style.right = 100 - 100 * (d / h) + "%";
c.style.top = Math.min(e, s - a.flakeHeight) + "px";
} else if (a.flakeBottom) {
c.style.right = 100 - 100 * (d / h) + "%";
c.style.top = Math.min(e, s - a.flakeHeight) + "px";
} else {
c.style.right = 100 - 100 * (d / h) + "%";
c.style.bottom = 100 - 100 * (e / l) + "%";
}
};
this.events = function() {
function a(c) {
c = b.call(c);
var d = c.length;
e ? (c[1] = "on" + c[1], 3 < d && c.pop()) : 3 === d && c.push(!1);
return c;
}
function d(a, b) {
var c = a.shift(),
d = [f[b]];
if (e) c[d](a[0], a[1]);
else c[d].apply(c, a);
}
var e = !g.addEventListener && g.attachEvent,
b = Array.prototype.slice,
f = {
add: e ? "attachEvent" : "addEventListener",
remove: e ? "detachEvent" : "removeEventListener"
};
return {
add: function() {
d(a(arguments), "add");
},
remove: function() {
d(a(arguments), "remove");
}
};
}();
this.randomizeWind = function() {
var c = k(a.vMaxX, 0.2);
z = 1 === parseInt(k(2), 10) ? -1 * c : c;
A = k(a.vMaxY, 0.2);
if (this.flakes) {
for (c = 0; c < this.flakes.length; c++) {
this.flakes[c].active && this.flakes[c].setVelocities();
}
}
};
this.scrollHandler = function() {
var c;
p = a.flakeBottom ? 0 : parseInt(
g.scrollY ||
f.documentElement.scrollTop ||
(r ? f.body.scrollTop : 0), 10
);
isNaN(p) && (p = 0);
if (!t && !a.flakeBottom && a.flakes) {
for (c = 0; c < a.flakes.length; c++) {
0 === a.flakes[c].active && a.flakes[c].stick();
}
}
};
this.resizeHandler = function() {
if (g.innerWidth || g.innerHeight) {
h = g.innerWidth - 16 - a.flakeRightOffset;
l = a.flakeBottom || g.innerHeight;
} else {
h = (f.documentElement.clientWidth ||
f.body.clientWidth ||
f.body.scrollWidth) - (!m ? 8 : 0) - a.flakeRightOffset;
l = a.flakeBottom ||
f.documentElement.clientHeight ||
f.body.clientHeight ||
f.body.scrollHeight;
}
s = f.body.offsetHeight;
n = parseInt(h / 2, 10);
};
this.resizeHandlerAlt = function() {
h = a.targetElement.offsetWidth - a.flakeRightOffset;
l = a.flakeBottom || a.targetElement.offsetHeight;
n = parseInt(h / 2, 10);
s = f.body.offsetHeight;
};
this.freeze = function() {
if (a.disabled) return !1;
a.disabled = 1;
a.timer = null;
};
this.resume = function() {
if (a.disabled) a.disabled = 0;
else return !1;
a.timerInit();
};
this.toggleSnow = function() {
if (a.flakes.length) {
a.active = !a.active;
a.active ? (a.show(), a.resume()) : (a.stop(), a.freeze());
} else {
a.start();
}
};
this.stop = function() {
var c;
this.freeze();
for (c = 0; c < this.flakes.length; c++) {
this.flakes[c].o.style.display = "none";
}
a.events.remove(g, "scroll", a.scrollHandler);
a.events.remove(g, "resize", a.resizeHandler);
if (a.freezeOnBlur) {
if (m) {
a.events.remove(f, "focusout", a.freeze);
a.events.remove(f, "focusin", a.resume);
} else {
a.events.remove(g, "blur", a.freeze);
a.events.remove(g, "focus", a.resume);
}
}
};
this.show = function() {
for (var a = 0; a < this.flakes.length; a++) {
this.flakes[a].o.style.display = "block";
}
};
// Конструктор снежинки
this.SnowFlake = function(c, d, e) {
var b = this;
// Свойства снежинки
this.type = c;
this.x = d || parseInt(k(h - 20), 10);
this.y = !isNaN(e) ? e : -k(l) - 12;
this.vY = this.vX = null;
this.vAmpTypes = [1, 1.2, 1.4, 1.6, 1.8];
this.vAmp = this.vAmpTypes[this.type] || 1;
this.melting = !1;
this.meltFrameCount = a.meltFrameCount;
this.meltFrames = a.meltFrames;
this.twinkleFrame = this.meltFrame = 0;
this.active = 1;
this.fontSize = 10 + 10 * (this.type / 5);
// Создание DOM-элемента
this.o = f.createElement("div");
this.o.innerHTML = a.snowCharacter;
if (a.className) {
this.o.setAttribute("class", a.className);
}
this.o.style.color = a.snowColor;
this.o.style.position = t ? "fixed" : "absolute";
if (a.useGPU && q.transform.prop) {
this.o.style[q.transform.prop] = "translate3d(0px, 0px, 0px)";
}
this.o.style.width = a.flakeWidth + "px";
this.o.style.height = a.flakeHeight + "px";
this.o.style.fontFamily = "arial,verdana";
this.o.style.cursor = "default";
this.o.style.overflow = "hidden";
this.o.style.fontWeight = "normal";
this.o.style.zIndex = a.zIndex;
C.appendChild(this.o);
// Методы снежинки
this.refresh = function() {
if (isNaN(b.x) || isNaN(b.y)) return !1;
a.setXY(b.o, b.x, b.y);
};
this.stick = function() {
if (r || a.targetElement !== f.documentElement && a.targetElement !== f.body) {
b.o.style.top = l + p - a.flakeHeight + "px";
} else if (a.flakeBottom) {
b.o.style.top = a.flakeBottom + "px";
} else {
b.o.style.display = "none";
b.o.style.bottom = "0%";
b.o.style.position = "fixed";
b.o.style.display = "block";
}
};
this.vCheck = function() {
if (0 <= b.vX && 0.2 > b.vX) {
b.vX = 0.2;
} else if (0 > b.vX && -0.2 < b.vX) {
b.vX = -0.2;
}
if (0 <= b.vY && 0.2 > b.vY) {
b.vY = 0.2;
}
};
this.move = function() {
var c = b.vX * v;
b.x += c;
b.y += b.vY * b.vAmp;
if (b.x >= h || h - b.x < a.flakeWidth) {
b.x = 0;
} else if (0 > c && b.x - a.flakeLeftOffset < -a.flakeWidth) {
b.x = h - a.flakeWidth - 1;
}
b.refresh();
if (l + p - b.y + a.flakeHeight < a.flakeHeight) {
b.active = 0;
a.snowStick ? b.stick() : b.recycle();
} else {
if (a.useMeltEffect && b.active && 3 > b.type && !b.melting && 0.998 < Math.random()) {
b.melting = !0;
b.melt();
}
if (a.useTwinkleEffect) {
if (0 > b.twinkleFrame) {
if (0.97 < Math.random()) {
b.twinkleFrame = parseInt(8 * Math.random(), 10);
}
} else {
b.twinkleFrame--;
if (u) {
b.o.style.opacity = b.twinkleFrame && 0 === b.twinkleFrame % 2 ? 0 : 1;
} else {
b.o.style.visibility = b.twinkleFrame && 0 === b.twinkleFrame % 2 ? "hidden" : "visible";
}
}
}
}
};
this.animate = function() {
b.move();
};
this.setVelocities = function() {
b.vX = z + k(0.12 * a.vMaxX, 0.1);
b.vY = A + k(0.12 * a.vMaxY, 0.1);
};
this.setOpacity = function(a, b) {
if (!u) return !1;
a.style.opacity = b;
};
this.melt = function() {
if (!a.useMeltEffect || !b.melting) {
b.recycle();
} else if (b.meltFrame < b.meltFrameCount) {
b.setOpacity(b.o, b.meltFrames[b.meltFrame]);
b.o.style.fontSize = b.fontSize - b.fontSize * (b.meltFrame / b.meltFrameCount) + "px";
b.o.style.lineHeight = a.flakeHeight + 2 + 0.75 * a.flakeHeight * (b.meltFrame / b.meltFrameCount) + "px";
b.meltFrame++;
} else {
b.recycle();
}
};
this.recycle = function() {
b.o.style.display = "none";
b.o.style.position = t ? "fixed" : "absolute";
b.o.style.bottom = "auto";
b.setVelocities();
b.vCheck();
b.meltFrame = 0;
b.melting = !1;
b.setOpacity(b.o, 1);
b.o.style.padding = "0px";
b.o.style.margin = "0px";
b.o.style.fontSize = b.fontSize + "px";
b.o.style.lineHeight = a.flakeHeight + 2 + "px";
b.o.style.textAlign = "center";
b.o.style.verticalAlign = "baseline";
b.x = parseInt(k(h - a.flakeWidth - 20), 10);
b.y = parseInt(-1 * k(l), 10) - a.flakeHeight;
b.refresh();
b.o.style.display = "block";
b.active = 1;
};
this.recycle();
this.refresh();
};
this.snow = function() {
var c = 0,
d = null,
e, d = 0;
for (e = a.flakes.length; d < e; d++) {
if (1 === a.flakes[d].active) {
a.flakes[d].move();
c++;
}
a.flakes[d].melting && a.flakes[d].melt();
}
if (c < a.flakesMaxActive) {
d = a.flakes[parseInt(k(a.flakes.length), 10)];
0 === d.active && (d.melting = !0);
}
a.timer && q.getAnimationFrame(a.snow);
};
this.mouseMove = function(c) {
if (!a.followMouse) return !0;
c = parseInt(c.clientX, 10);
if (c < n) {
v = -2 + 2 * (c / n);
} else {
c -= n;
v = 2 * (c / n);
}
};
this.createSnow = function(c, d) {
var e;
for (e = 0; e < c; e++) {
if (a.flakes[a.flakes.length] = new a.SnowFlake(parseInt(k(6), 10)), d || e > a.flakesMaxActive) {
a.flakes[a.flakes.length - 1].active = -1;
}
}
a.targetElement.appendChild(C);
};
this.timerInit = function() {
a.timer = !0;
a.snow();
};
this.init = function() {
var c;
for (c = 0; c < a.meltFrameCount; c++) {
a.meltFrames.push(1 - c / a.meltFrameCount);
}
a.randomizeWind();
a.createSnow(a.flakesMax);
a.events.add(g, "resize", a.resizeHandler);
a.events.add(g, "scroll", a.scrollHandler);
if (a.freezeOnBlur) {
if (m) {
a.events.add(f, "focusout", a.freeze);
a.events.add(f, "focusin", a.resume);
} else {
a.events.add(g, "blur", a.freeze);
a.events.add(g, "focus", a.resume);
}
}
a.resizeHandler();
a.scrollHandler();
if (a.followMouse) {
a.events.add(m ? f : g, "mousemove", a.mouseMove);
}
a.animationInterval = Math.max(20, a.animationInterval);
a.timerInit();
};
this.start = function(c) {
if (B) {
if (c) return !0;
} else {
B = !0;
}
if ("string" === typeof a.targetElement) {
c = a.targetElement;
a.targetElement = f.getElementById(c);
if (!a.targetElement) {
throw Error('Snowstorm: Unable to get targetElement "' + c + '"');
}
}
a.targetElement || (a.targetElement = f.body || f.documentElement);
if (a.targetElement !== f.documentElement && a.targetElement !== f.body) {
a.resizeHandler = a.resizeHandlerAlt;
a.usePixelPosition = !0;
}
a.resizeHandler();
a.usePositionFixed = a.usePositionFixed && !r && !a.flakeBottom;
if (g.getComputedStyle) {
try {
w = "relative" === g.getComputedStyle(a.targetElement, null).getPropertyValue("position");
} catch (d) {
w = !1;
}
}
t = a.usePositionFixed;
if (h && (l && !a.disabled)) {
a.init();
a.active = !0;
}
};
// Автозапуск
if (a.autoStart) {
a.events.add(g, "load", y, !1);
}
return this;
}(window, document);

1207
assets/style.css
View file

File diff suppressed because it is too large Load diff

563
index.html
View file

@ -1,304 +1,331 @@
<!doctype html>
<html lang="eng">
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta
name="description"
content="Czechoslovakian Union of Nationalistic Technicians — Drunken Solutions Around The World"
/>
<meta property="og:title" content="CZSK C.U.N.T." />
<meta
property="og:description"
content="Czechoslovakian Union of Nationalistic Technicians — Drunken Solutions Around The World"
/>
<meta property="og:image" content="pix/logo.png" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://czsk.it/" />
<meta property="og:locale" content="en_US" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="CZSK C.U.N.T." />
<meta
name="twitter:description"
content="Czechoslovakian Union of Nationalistic Technicians — Drunken Solutions Around The World"
/>
<meta name="twitter:image" content="pix/logo.png" />
<meta name="theme-color" content="#0D0D11" />
<title>CZSK C.U.N.T.</title>
<link rel="shortcut icon" href="pix/favicon.png" type="image/x-icon" />
<link rel="stylesheet" href="assets/style.css" />
<link rel="icon" type="image/png" href="pix/favicon.png" />
<link rel="canonical" href="https://czsk.it/" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
rel="stylesheet"
/>
<script src="assets/fractal_snowflake.js"></script>
<script src="assets/inversion.js"></script>
<link rel="stylesheet" href="assets/style.css" />
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "CZSK C.U.N.T.",
"description": "Czechoslovakian Union of Nationalistic Technicians — Drunken Solutions Around The World",
"url": "https://czsk.it/",
"logo": "https://czsk.it/pix/logo.png"
}
</script>
</head>
<body>
<!-- nav -->
<section id="nav-section">
<img src="pix/logo.png" alt="logo" width="40px" />
<div class="scroll-progress" aria-hidden="true"></div>
<div class="atmos-shapes" aria-hidden="true">
<div class="atmos-circle"></div>
<div class="atmos-line"></div>
<div class="atmos-square"></div>
</div>
<!-- SVG filter for film grain -->
<svg class="sr-only" aria-hidden="true">
<filter id="grain">
<feTurbulence
type="fractalNoise"
baseFrequency="0.65"
numOctaves="3"
stitchTiles="stitch"
/>
<feColorMatrix type="saturate" values="0" />
</filter>
</svg>
<nav id="nav-section" aria-label="Main navigation">
<img src="pix/logo.png" alt="CZSK C.U.N.T. logo" width="40" />
<div class="navigation">
<a href="#our-numbers">ABOUT US</a>
<a href="#photos-section">OUR HEROES</a>
</div>
</section>
<!-- header -->
<section id="header-section">
</nav>
<header id="hero">
<div class="titles">
<div class="tit1">we are the</div>
<h1>CZSK</h1>
<div class="tit2">
<div class="tit1" data-reveal>we are the</div>
<h1 class="hero-heading" data-reveal>CZSK</h1>
<div class="tit2" data-reveal>
DRUNKEN SOLUTIONS <br />
AROUND THE WORLD
</div>
</div>
<div class="links">
<a href="https://t.me/czechoslovakiia" target="_blank">
<img src="pix/telegram.png" alt="" width="32px" />
<a
href="https://t.me/czechoslovakiia"
target="_blank"
rel="noopener noreferrer"
aria-label="Telegram"
>
<img src="pix/telegram.png" alt="Telegram" width="48" />
</a>
<br />
<a href="https://git.czsk.it/" target="_blank">
<img src="pix/git.png" alt="" width="32px" />
<a
href="https://git.czsk.it/"
target="_blank"
rel="noopener noreferrer"
aria-label="Gitea"
>
<img src="pix/git.png" alt="Gitea" width="48" />
</a>
</div>
</section>
<!-- numbers-->
<section id="our-numbers">
<h3>Our work speaks trough numbers//</h3>
<div class="numbers">
<div class="number">
<h2>27+</h2>
<h4>COUNTRIES WAS RUINED</h4>
<p style="opacity: 40%">We travel a lot around the world</p>
<div class="scroll-hint" aria-hidden="true"></div>
</header>
<main>
<section id="our-numbers">
<h3 data-reveal>Our work speaks through numbers//</h3>
<div class="numbers">
<div class="number" data-reveal>
<h2>
<span data-count="27" data-suffix="+">00+</span>
</h2>
<h4>COUNTRIES WAS RUINED</h4>
<p class="stat-desc">
We travel a lot around the world
</p>
</div>
<div class="number" data-reveal>
<h2><span data-count="3" data-suffix="%">00%</span></h2>
<h4>SATISFACTION RATE</h4>
<p class="stat-desc">Every body hates us</p>
</div>
<div class="number" data-reveal>
<h2>
<span data-count="15" data-suffix="+">00+</span>
</h2>
<h4>YEARS OF EXPERIENCE</h4>
<p class="stat-desc">
Decades of destroying our's own life
</p>
</div>
<div class="number" data-reveal>
<h2><span data-count="0" data-suffix="">00</span></h2>
<h4>SUCCESS</h4>
<p class="stat-desc">We did absolutely nothing</p>
</div>
<div class="number" data-reveal>
<h2><span data-count="5" data-suffix="">00</span></h2>
<h4>COLUMNS</h4>
<p class="stat-desc">
The designer wanted to put 5 columns here
</p>
</div>
</div>
<div class="number">
<h2>03%</h2>
<h4>SATISFACTION RATE</h4>
<p style="opacity: 40%">Every body hates us</p>
</div>
<div class="number">
<h2>15+</h2>
<h4>YEARS OF EXPERIENCE</h4>
<p style="opacity: 40%">
Decades of destroying our’s own life
</section>
<section id="wtf">
<div class="wtftitle">
<h5>
<span class="wtf-line">WHAT THE</span>
<span class="wtf-line">ACTUAL FUCK?</span>
</h5>
<p class="wtf-body">
No one knows what we created or why we created it. We
have no goal, we have no idea. Even the president
doesn't understand the nonsense that led to the
Czechoslovakian Union of Nationalistic Technicians.
<br /><br /><br />
Welcome to us. And fuck you.
</p>
</div>
<div class="number">
<h2>00</h2>
<h4>SUCCESS</h4>
<p style="opacity: 40%">We did absolutely nothing</p>
</section>
<section id="photos-section">
<h3 data-reveal>Heroes of CUNT//CZSK</h3>
<div class="photos-grid">
<div class="photo-card featured" data-reveal>
<div class="photo-container">
<img
src="pix/president.jpg"
alt="President Seryoza"
loading="lazy"
/>
<h6>President</h6>
</div>
<div class="photo-name">Seryoza</div>
</div>
<div class="photo-card" data-reveal>
<div class="photo-container">
<img
src="pix/primeminister.jpg"
alt="Prime Minister Aleks"
loading="lazy"
/>
<h6>Prime <br />Minister</h6>
</div>
<div class="photo-name">Aleks</div>
</div>
<div class="photo-card" data-reveal>
<div class="photo-container">
<img
src="pix/healthcare.jpg"
alt="Minister of Healthcare Nikita Eriel"
loading="lazy"
/>
<h6>Minister of <br />Healthcare</h6>
</div>
<div class="photo-name">Nikita Eriel</div>
</div>
<div class="photo-card" data-reveal>
<div class="photo-container">
<img
src="pix/internal_affairs.jpg"
alt="Minister of Internal Affairs Jaan"
loading="lazy"
/>
<h6>Minister of <br />Internal Affairs</h6>
</div>
<div class="photo-name">Jaan</div>
</div>
<div class="photo-card" data-reveal>
<div class="photo-container">
<img
src="pix/culture/culture2.jpg"
alt="Minister of Culture Sandra"
loading="lazy"
/>
<h6>Minister of <br />Culture</h6>
</div>
<div class="photo-name">Sandra</div>
</div>
<div class="photo-card" data-reveal>
<div class="photo-container">
<img
src="pix/trade.jpg"
alt="Minister of Trade ¥an"
loading="lazy"
/>
<h6>Minister of <br />Trade</h6>
</div>
<div class="photo-name">¥an</div>
</div>
<div class="photo-card" data-reveal>
<div class="photo-container">
<img
src="pix/cat/cat2.jpg"
alt="Minister of Regional Affairs Art"
loading="lazy"
/>
<h6>Minister of <br />Regional Affairs</h6>
</div>
<div class="photo-name">Art</div>
</div>
<div class="photo-card" data-reveal>
<div class="photo-container">
<img
src="pix/iierar.jpg"
alt="Minister of Alternative Foreign Policy PAVEL"
loading="lazy"
/>
<h6>
Minister of <br />Alternative Foreign Policy
</h6>
</div>
<div class="photo-name">PAVEL</div>
</div>
<div class="photo-card" data-reveal>
<div class="photo-container">
<img
src="pix/vietman.jpg"
alt="Ambassador to Vietnam"
loading="lazy"
/>
<h6>Ambassador to Vietnam</h6>
</div>
<div class="photo-name">loquito de la casa</div>
</div>
<div class="photo-card" data-reveal>
<div class="photo-container">
<img
src="pix/env.jpg"
alt="Minister of the Environment Bee-bee"
loading="lazy"
/>
<h6>Minister of the Environment</h6>
</div>
<div class="photo-name">Bee-bee</div>
</div>
<div class="photo-card" data-reveal>
<div class="photo-container">
<img
src="pix/gleb.jpg"
alt="Minister of Glebing"
loading="lazy"
/>
<h6>Minister of Glebing</h6>
</div>
<div class="photo-name">Gleb</div>
</div>
<div class="photo-card" data-reveal>
<div class="photo-container">
<img
src="pix/atf.jpg"
alt="Head of ATF Masha"
loading="lazy"
/>
<h6>Head of ATF</h6>
</div>
<div class="photo-name">Masha</div>
</div>
</div>
<div class="number">
<h2>05</h2>
<h4>COLUMNS</h4>
<p style="opacity: 40%">
The designer wanted to put 5 columns here
</p>
</div>
</div>
</section>
<!-- wtf -->
<section id="wtf">
<div class="wtftitle">
<h5 style="justify-content: center">
WHAT THE <br />
ACTUAL FUCK?
</h5>
<p style="padding-top: 100px; opacity: 50%">
No one knows what we created or why we created it. We have
no goal, we have no idea. Even the president doesn't
understand the nonsense that led to the Czechoslovakian
Union of Nationalistic Technicians.
<br /><br /><br />
Welcome to us. And fuck you.
</section>
</main>
<footer>
<div class="footer-inner">
<p>
<span id="current-year"></span>
— Landing page of Czechoslovakian Union of Nationalistic
Technicians // by
<a
href="https://nikitajevdookishkin.github.io/designer/"
class="flink"
target="_blank"
rel="noopener noreferrer"
>NJ</a
>
</p>
<a href="#hero" class="back-to-top">Back to top</a>
</div>
</section>
<section id="photos-section">
<h3>Heroes of CUNT//CZSK</h3>
<div class="photos-grid">
<!-- Карточка 1 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/president.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>President</h6>
</div>
<div class="photo-name">Seryoza</div>
</div>
<!-- Карточка 2 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/primeminister.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>
Prime <br />
Minister
</h6>
</div>
<div class="photo-name">Aleks</div>
</div>
</footer>
<!-- Карточка 3 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/healthcare.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>
Minister of <br />
Healthcare
</h6>
</div>
<div class="photo-name">Nikita Eriel</div>
</div>
<!-- Карточка 4 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/internal_affairs.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>
Minister of <br />
Internal Affairs
</h6>
</div>
<div class="photo-name">Jaan</div>
</div>
<!-- Карточка 5 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/culture/culture2.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>
Minister of <br />
Culture
</h6>
</div>
<div class="photo-name">Sandra</div>
</div>
<!-- Карточка 6 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/trade.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>
Minister of <br />
Trade
</h6>
</div>
<div class="photo-name">¥an</div>
</div>
<!-- Карточка 7 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/cat/cat2.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>
Minister of <br />
Regional Affairs
</h6>
</div>
<div class="photo-name">Art</div>
</div>
<!-- Карточка 8 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/iierar.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>
Minister of <br />
Alternative Foreign Policy
</h6>
</div>
<div class="photo-name">PAVEL</div>
</div>
<!-- Дальше карточки можно дублировать -->
<!-- Карточка 9 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/vietman.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>Ambassador to Vietnam</h6>
</div>
<div class="photo-name">loquito de la casa</div>
</div>
<!-- Дальше карточки можно дублировать -->
<!-- Карточка 10 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/env.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>Minister of the Environment</h6>
</div>
<div class="photo-name">Bee-bee</div>
</div>
<!-- Дальше карточки можно дублировать -->
<!-- Карточка 11 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/gleb.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>Minister of the Environment</h6>
</div>
<div class="photo-name">Gleb</div>
</div>
<!-- Дальше карточки можно дублировать -->
<!-- Карточка 12 -->
<div class="photo-card">
<div class="photo-container">
<img
src="pix/atf.jpg"
alt=""
style="width: 100%; height: 100%; object-fit: cover"
/>
<h6>Head of ATF</h6>
</div>
<div class="photo-name">Masha</div>
</div>
<!-- Дальше карточки можно дублировать -->
</div>
</section>
<section class="footer">
<p>
<span id="current-year"></span>
- Landing page of Czechoslovakian Union of Nationalistic
Technicians // by
<a
href="https://nikitajevdookishkin.github.io/designer/"
class="flink"
target="_blank"
style="text-decoration: none; color: #fff"
>NJ</a
>
</p>
</section>
<script>
// year loader
document.addEventListener("DOMContentLoaded", function () {
// Get the current year
const currentYear = new Date().getFullYear();
// Find the element with the id 'current-year' and set its text content
const yearElement = document.getElementById("current-year");
if (yearElement) {
yearElement.textContent = currentYear;
}
});
</script>
<script src="assets/fractal_snowflake.js"></script>
<script src="assets/inversion.js"></script>
<script src="assets/main.js"></script>
</body>
</html>

39
nginx.conf Normal file
View file

@ -0,0 +1,39 @@
server {
listen 80;
server_name _;
server_tokens off;
root /usr/share/nginx/html;
index index.html;
# Security headers
add_header X-Frame-Options "SAMEORIGIN" always;
add_header X-Content-Type-Options "nosniff" always;
add_header Referrer-Policy "strict-origin-when-cross-origin" always;
add_header Permissions-Policy "camera=(), microphone=(), geolocation=()" always;
# Gzip compression
gzip on;
gzip_vary on;
gzip_min_length 256;
gzip_types text/plain text/css application/javascript application/json image/svg+xml;
# Static asset caching
location ~* \.(jpg|jpeg|png|gif|ico|svg|webp)$ {
expires 30d;
add_header Cache-Control "public, immutable";
}
location ~* \.(css|js)$ {
expires 7d;
add_header Cache-Control "public";
}
location ~* \.(woff|woff2|ttf|otf|eot)$ {
expires 365d;
add_header Cache-Control "public, immutable";
}
location / {
try_files $uri $uri/ =404;
}
}

BIN
pix/commander.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 184 KiB

BIN
pix/defence.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 253 KiB

BIN
pix/spain.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 141 KiB

3
robots.txt Normal file
View file

@ -0,0 +1,3 @@
User-agent: *
Allow: /
Sitemap: https://czsk.it/sitemap.xml

8
sitemap.xml Normal file
View file

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://czsk.it/</loc>
<changefreq>monthly</changefreq>
<priority>1.0</priority>
</url>
</urlset>