min
/
minrip
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

more?

This commit is contained in:
minish 2025-09-10 04:26:14 -04:00
parent e0d2791458
commit be94db33e2
Signed by: min
SSH Key Fingerprint: SHA256:mf+pUTmK92Y57BuCjlkBdd82LqztTfDCQIUp0fCKABc
6 changed files with 35 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
TimesNewPixel.ttf Normal file
View File

Binary file not shown.

9
index.html
View File

@ -21,10 +21,15 @@
<body> <body>
<canvas id="bg"></canvas> <canvas id="bg"></canvas>
<main> <main>
<h1>Title</h1> <img class="shadow" src="/templogo.png" style="image-rendering: pixelated;" width="500"></img>
<center>
<h2 class="shadow">Test for internet websites</h2>
</center>
</main> </main>
<footer> <footer>
<p>page footer</p> <div>
<p class="shadow">2025 (c) minish ^.^</p>
</div>
</footer> </footer>
</body> </body>
</html> </html>

2
js/main.js
View File

@ -6,7 +6,7 @@ var gl = canvas.getContext("webgl", {
}); });
function resizeCanvas() { function resizeCanvas() {
const scl = (p) => Math.trunc(p / 4); const scl = (p) => Math.trunc(p / 2);
var width = scl(gl.canvas.clientWidth); var width = scl(gl.canvas.clientWidth);
var height = scl(gl.canvas.clientHeight); var height = scl(gl.canvas.clientHeight);

18
shader/bg.frag
View File

@ -61,9 +61,19 @@ void main() {
float dist = distance(herescaled, center); float dist = distance(herescaled, center);
float distf = smoothstep(0.0, shortside, dist); float distf = smoothstep(0.0, shortside, dist);
float second = floor(u_time * 1.1); // at lower clock values, we make vignette gradient denser
float noise = snoise(vec2(herescaled.x * herescaled.y, second)); // (at kinda slow rate for a breathing effect)
float final = distf - noise * 0.8; float slowtime = u_time / 2.0;
float timing = sin(slowtime) + 1.0;
float vig = distf + mix(-0.05, 0.0, timing);
gl_FragColor = mix(lighter, darker, final); // randomize noise pattern every second ish
float fasttime = u_time * 1.1;
float second = floor(fasttime);
float noise = snoise(vec2(herescaled.x * herescaled.y, second));
// blend noise and gradient
float final = (1.0 - vig) - noise * 0.9;
gl_FragColor = mix(darker, lighter, final);
} }

13
style.css
View File

@ -3,6 +3,11 @@
--fg1: #ffffff; --fg1: #ffffff;
} }
@font-face {
font-family: TimesNewPixel;
src: url("/TimesNewPixel.ttf");
}
* { * {
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
@ -15,6 +20,13 @@ body {
background: var(--bg); background: var(--bg);
color: var(--fg1); color: var(--fg1);
font-family: TimesNewPixel;
}
.shadow {
filter: drop-shadow(1px 1px 0 var(--bg)) drop-shadow(-1px 1px 0 var(--bg))
drop-shadow(1px -1px 0 var(--bg)) drop-shadow(-1px -1px 0 var(--bg));
} }
#bg { #bg {
@ -42,4 +54,5 @@ footer {
bottom: 0; bottom: 0;
left: 0; left: 0;
width: 100vw; width: 100vw;
padding: 4px;
} }

BIN
templogo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB