fix horizontal scroll, header links back to wiki
All checks were successful
/ build (push) Successful in 10s

This commit is contained in:
kritzl 2025-02-17 00:42:41 +01:00
commit 8baaa1b176
Signed by: kritzl
SSH key fingerprint: SHA256:5BmINP9VjZWaUk5Z+2CTut1KFhwLtd0ZynMekKbtViM
8 changed files with 92 additions and 58 deletions

View file

@ -10,12 +10,14 @@
<body style="height: 100vh;">
<header>
<img src="../assets/image/logo_eventname_glow.svg" class="header-image dark-only" alt="Logo of Easterhegg 2025. In the style of a neon sign:
<a href="/" id="backToWiki">
<img src="../assets/image/logo_eventname_glow.svg" class="header-image dark-only" alt="Logo of Easterhegg 2025. In the style of a neon sign:
The text 'Unhandled Eggception Easterhegg 2025' with a line art of a hare and an egg.
The egg shell and the word 'Eggception' are glowing in a light blue, everything else in a bright pink." />
<img src="../assets/image/logo_eventname_glow_off.svg" class="header-image light-only" alt="Logo of Easterhegg 2025. In the style of a unpowered neon sign:
The egg shell and the word 'Eggception' are glowing in a light blue, everything else in a bright pink."/>
<img src="../assets/image/logo_eventname_glow_off.svg" class="header-image light-only" alt="Logo of Easterhegg 2025. In the style of a unpowered neon sign:
The text 'Unhandled Eggception Easterhegg 2025' with a line art of a hare and an egg.
The egg shell and the word 'Eggception' are dimly glowing in a dark blue, everything else in a dark pink." />
The egg shell and the word 'Eggception' are dimly glowing in a dark blue, everything else in a dark pink."/>
</a>
</header>
<div>
<nav>
@ -27,8 +29,10 @@
<li><a href="../typography"><i data-icon="info"></i>Typography</a></li>
<li><a href="../demopage"><i data-icon="info"></i>Demopage</a></li>
<li class="active"><a href=""><i data-icon="info"></i>Image Generator</a></li>
<li class="dark-only toggleTheme" data-theme="light"><a href="#" aria-label="switch to light theme"><i data-icon="light" class="glow"></i></a></li>
<li class="light-only toggleTheme" data-theme="dark"><a href="#" aria-label="switch to dark theme"><i data-icon="light" class="glow"></i></a></li>
<li class="dark-only toggleTheme" data-theme="light"><a href="#" aria-label="switch to light theme"><i
data-icon="light" class="glow"></i></a></li>
<li class="light-only toggleTheme" data-theme="dark"><a href="#" aria-label="switch to dark theme"><i
data-icon="light" class="glow"></i></a></li>
</ul>
</nav>
<main class="generator">
@ -38,51 +42,51 @@
<input id="file_input" type="file" name="image" accept="image/*">
</div>
<img id="source_img" src="" />
<img id="source_img" src=""/>
<i data-icon="arrow-down"></i>
<img id="result_img" src="" />
<img id="result_img" src=""/>
<div style="display: none;">
<svg width="600" height="400" xmlns="http://www.w3.org/2000/svg">
<filter id="filter0" color-interpolation-filters="linearRGB" filterUnits="objectBoundingBox"
primitiveUnits="objectBoundingBox">
<feColorMatrix in="SourceGraphic" type="saturate" values="0" result="bw" />
<feColorMatrix in="bw" type="luminanceToAlpha" result="ltoa" />
primitiveUnits="objectBoundingBox">
<feColorMatrix in="SourceGraphic" type="saturate" values="0" result="bw"/>
<feColorMatrix in="bw" type="luminanceToAlpha" result="ltoa"/>
<feComponentTransfer in="ltoa" result="ltoa_inverse">
<feFuncA type="table" tableValues="0 1" />
<feFuncA type="table" tableValues="0 1"/>
</feComponentTransfer>
<feConvolveMatrix in="ltoa_inverse" result="pink_edges"
kernelMatrix="-4 0 4 0 0 0 -4 0 4" />
kernelMatrix="-4 0 4 0 0 0 -4 0 4"/>
<feComponentTransfer in="pink_edges" result="pink">
<feFuncR type="table" tableValues="0.7765 0" />
<feFuncG type="table" tableValues="0.1451 0" />
<feFuncB type="table" tableValues="0.4902 0" />
<feFuncR type="table" tableValues="0.7765 0"/>
<feFuncG type="table" tableValues="0.1451 0"/>
<feFuncB type="table" tableValues="0.4902 0"/>
</feComponentTransfer>
<feOffset in="pink" result="pink_shift" dx="-0.002" />
<feOffset in="pink" result="pink_shift" dx="-0.002"/>
<feConvolveMatrix in="ltoa_inverse" result="cyan_edges"
kernelMatrix="4 0 -4 0 0 0 4 0 -4" />
kernelMatrix="4 0 -4 0 0 0 4 0 -4"/>
<feComponentTransfer in="cyan_edges" result="cyan">
<feFuncR type="table" tableValues="0.2941 0" />
<feFuncG type="table" tableValues="0.6784 0" />
<feFuncB type="table" tableValues="0.8471 0" />
<feFuncR type="table" tableValues="0.2941 0"/>
<feFuncG type="table" tableValues="0.6784 0"/>
<feFuncB type="table" tableValues="0.8471 0"/>
</feComponentTransfer>
<feOffset in="cyan" result="cyan_shift" dx="0.002" />
<feOffset in="cyan" result="cyan_shift" dx="0.002"/>
<feMerge result="pink_cyan_shift">
<feMergeNode in="SourceGraphic" />
<feMergeNode in="pink_shift" />
<feMergeNode in="cyan_shift" />
<feMergeNode in="SourceGraphic"/>
<feMergeNode in="pink_shift"/>
<feMergeNode in="cyan_shift"/>
</feMerge>
<feTurbulence type="fractalNoise" baseFrequency="0 0.2" numOctaves="1" result="noise" />
<feDisplacementMap in="pink_cyan_shift" in2="noise" result="distorted_raw" scale="0.02" />
<feOffset in="distorted_raw" result="distorted" />
<feTurbulence type="fractalNoise" baseFrequency="0 0.2" numOctaves="1" result="noise"/>
<feDisplacementMap in="pink_cyan_shift" in2="noise" result="distorted_raw" scale="0.02"/>
<feOffset in="distorted_raw" result="distorted"/>
</filter>
<g filter="url(#filter0)">
<image href="" width="100%" height="100%" />
<image href="" width="100%" height="100%"/>
</g>
</svg>
</div>