fix: viewport-fixed, deterministic background so content changes don't shift it
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01BCrwHHnGCB5XH968Nxokqw
This commit is contained in:
@@ -14,20 +14,28 @@
|
||||
el.hidden = false;
|
||||
};
|
||||
|
||||
// Звёзды: 90 по небу, 170 в полосе (дуга −14°)
|
||||
// Звёзды: 90 по небу, 170 в полосе (дуга −14°). Генератор с фиксированным зерном,
|
||||
// чтобы небо было одинаковым при каждой перезагрузке и не «прыгало» после действий.
|
||||
let seed = 0x48414430; // "HAD0"
|
||||
const rand = () => {
|
||||
seed = (seed + 0x6D2B79F5) | 0;
|
||||
let t = Math.imul(seed ^ (seed >>> 15), 1 | seed);
|
||||
t = (t + Math.imul(t ^ (t >>> 7), 61 | t)) ^ t;
|
||||
return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
|
||||
};
|
||||
const star = (color, size, bright, x, y, dur, delay) => {
|
||||
const s = document.createElement('div');
|
||||
s.style.cssText = `position:absolute;border-radius:50%;left:${x}%;top:${y}%;width:${size}px;height:${size}px;background:${color};${bright ? `box-shadow:0 0 6px ${color};` : ''}animation:skTwinkle ${dur}s ease-in-out ${delay}s infinite`;
|
||||
return s;
|
||||
};
|
||||
const sky = document.getElementById('stars'), band = document.getElementById('band');
|
||||
for (let i = 0; i < 90; i++) sky.appendChild(star(Math.random() < .2 ? '#8FD6DC' : '#F2ECE0', Math.random() < .85 ? 1.5 : 2.5, false, (Math.random() * 100).toFixed(2), (Math.random() * 100).toFixed(2), (3 + Math.random() * 5).toFixed(1), (-Math.random() * 8).toFixed(1)));
|
||||
for (let i = 0; i < 90; i++) sky.appendChild(star(rand() < .2 ? '#8FD6DC' : '#F2ECE0', rand() < .85 ? 1.5 : 2.5, false, (rand() * 100).toFixed(2), (rand() * 100).toFixed(2), (3 + rand() * 5).toFixed(1), (-rand() * 8).toFixed(1)));
|
||||
for (let j = 0; j < 170; j++) {
|
||||
const bright = Math.random() < .08, r = Math.random();
|
||||
const bright = rand() < .08, r = rand();
|
||||
const color = r < .68 ? '#F2ECE0' : (r < .88 ? '#F7CEDC' : '#8FD6DC');
|
||||
const g = (Math.random() + Math.random() + Math.random()) / 3, x = Math.random() * 100;
|
||||
const g = (rand() + rand() + rand()) / 3, x = rand() * 100;
|
||||
const arc = 28 * Math.pow((x - 50) / 50, 2) + Math.max(0, 35 - x) * .35;
|
||||
band.appendChild(star(color, bright ? 2.2 : (0.8 + Math.random() * 1.1).toFixed(1), bright, x.toFixed(2), (6 + g * 55 + arc).toFixed(2), (2.5 + Math.random() * 5).toFixed(1), (-Math.random() * 8).toFixed(1)));
|
||||
band.appendChild(star(color, bright ? 2.2 : (0.8 + rand() * 1.1).toFixed(1), bright, x.toFixed(2), (6 + g * 55 + arc).toFixed(2), (2.5 + rand() * 5).toFixed(1), (-rand() * 8).toFixed(1)));
|
||||
}
|
||||
|
||||
// Панели архив/настройки
|
||||
|
||||
Reference in New Issue
Block a user