Switch to warm minimal theme: linen texture, muted warm tones, add service links (Gitea/Cloudreve/MC)
This commit is contained in:
@@ -1,68 +0,0 @@
|
||||
(function () {
|
||||
const canvas = document.getElementById('star-canvas');
|
||||
if (!canvas) return;
|
||||
const ctx = canvas.getContext('2d');
|
||||
let w, h;
|
||||
|
||||
function resize() {
|
||||
w = canvas.width = canvas.parentElement.clientWidth;
|
||||
h = canvas.height = canvas.parentElement.clientHeight;
|
||||
}
|
||||
resize();
|
||||
window.addEventListener('resize', resize);
|
||||
|
||||
const STAR_COUNT = 300;
|
||||
const colors = ['#ffffff', '#e0f7fa', '#fff9c4', '#fce4ec', '#4fc3f7'];
|
||||
const stars = [];
|
||||
|
||||
for (let i = 0; i < STAR_COUNT; i++) {
|
||||
stars.push({
|
||||
x: Math.random() * w,
|
||||
y: Math.random() * h,
|
||||
baseR: Math.random() * 1.5 + 0.3,
|
||||
phase: Math.random() * Math.PI * 2,
|
||||
speed: Math.random() * 0.02 + 0.005,
|
||||
color: colors[Math.floor(Math.random() * colors.length)],
|
||||
glow: Math.random() > 0.7
|
||||
});
|
||||
}
|
||||
|
||||
function draw() {
|
||||
ctx.clearRect(0, 0, w, h);
|
||||
const t = performance.now() * 0.001;
|
||||
|
||||
for (const s of stars) {
|
||||
const r = s.baseR + Math.sin(t * s.speed * 10 + s.phase) * s.baseR * 0.6;
|
||||
const alpha = 0.4 + Math.sin(t * s.speed * 8 + s.phase) * 0.35;
|
||||
|
||||
ctx.globalAlpha = Math.max(0.1, alpha);
|
||||
ctx.beginPath();
|
||||
ctx.arc(s.x, s.y, Math.max(0.1, r), 0, Math.PI * 2);
|
||||
ctx.fillStyle = s.color;
|
||||
ctx.fill();
|
||||
|
||||
if (s.glow) {
|
||||
const gr = ctx.createRadialGradient(s.x, s.y, 0, s.x, s.y, r * 3);
|
||||
gr.addColorStop(0, s.color);
|
||||
gr.addColorStop(1, 'transparent');
|
||||
ctx.globalAlpha = alpha * 0.15;
|
||||
ctx.beginPath();
|
||||
ctx.arc(s.x, s.y, r * 3, 0, Math.PI * 2);
|
||||
ctx.fillStyle = gr;
|
||||
ctx.fill();
|
||||
}
|
||||
}
|
||||
ctx.globalAlpha = 1;
|
||||
requestAnimationFrame(draw);
|
||||
}
|
||||
|
||||
draw();
|
||||
|
||||
// reposition on resize
|
||||
window.addEventListener('resize', () => {
|
||||
for (const s of stars) {
|
||||
s.x = (s.x / w) * canvas.width;
|
||||
s.y = (s.y / h) * canvas.height;
|
||||
}
|
||||
});
|
||||
})();
|
||||
Reference in New Issue
Block a user