xbl/6bit.ch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

modified: index.html

Browse Source 
new file:   js/art.js
	new file:   js/hdr.js
	new file:   js/hearts.js
	new file:   js/helpers.js
	new file:   js/particles.js
	new file:   js/qlpycon.js
	new file:   js/qlpyconbanner.js
	new file:   js/snek.js
	new file:   js/sparks.js
	new file:   js/stars.js
	modified:   slamp.html
	modified:   style.css
This commit is contained in:
root
2026-06-14 14:08:52 +02:00
parent 3040ffdf20
commit 39752c845a
13 changed files with 1764 additions and 266 deletions
Download Patch File Download Diff File Expand all files Collapse all files

224
html/index.html
View File

@ -2,63 +2,201 @@
<html lang="en">
<head>
<title>6bit.ch</title>
<link rel="shortcut icon" type="image/png" href="img/favicon.png"/>
<link rel="shortcut icon" type="image/png" href="img/favicon.png">
<link rel="stylesheet" href="style.css">
<link rel="author" type="text/plain" href="humans.txt">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script type="text/javascript" src="js/sparks.js"></script>
<script type="text/javascript" src="js/hearts.js"></script>
</head>
<body style="background-color:#101010;">
<body>
<div class="main">
<div id="starshine">
<div class="template shine"></div>
</div>
<section class=headerimg>
<a href="https://6bit.ch"><img src="img/6bitnobg.png"></a>
<section class="contentindex">
<p><button onclick="rerollArt()" class="reroll-btn">[ reroll ]</button></p>
<canvas id="hdr"></canvas>
<p>The trajectory of this <a href="https://wikipedia.org/wiki/Earth" target="_blank" rel="noopener">ship</a> is unchanging.</p>
</section>
<div class="col left">
<section class="navblock">
<section class="linksblock">
<div class="linkgroup">
<h4>🏡 here</h4>
<ul><li><a href=https://git.6bit.ch/xbl>🐐 Goat</a></li></ul>
<ul><li><a href=https://6bit.ch/snek.html>🐍 Snek</a></li></ul>
<ul><li><a href=https://6bit.ch/things.html>🎨 Things</a></li></ul>
<ul><li><a href=https://6bit.ch/slamp.html>💡 slamp</a></li></ul>
</section>
</br>
<section class="navblock">
<ul>
<li><a href="https://git.6bit.ch/xbl">🐐 Goat</a></li>
<li><a href="slamp.html">💡 Slamp</a></li>
<li><a href="https://wiki.6bit.ch/index.php?title=Special:AllPages">🪓 Wiki</a></li>
<li><a href="https://6bit.ch/xbl.txt" target="_blank" rel="noopener">🚀 q3cfg</a></li>
</ul>
</div>
<div class="linkgroup">
<h4>✨ there</h4>
<ul><li><a href=https://hardbrugg.ch target=_blank>📽️ Hardbrugg.ch</a></li></ul>
<ul><li><a href=https://ravemitherz.li target=_blank>💗 RAVEmitHerz.li</a></li></ul>
<ul><li><a href=https://rumpelkist.li target=_blank>🛸 Rumpelkist.li</a></li></ul>
</section>
</br>
<section class="navblock">
<ul>
<li><a href="https://hardbrugg.ch" target="_blank" rel="noopener">📽️ Hardbrugg.ch</a></li>
<li><a href="https://ravemitherz.li" target="_blank" rel="noopener">💗 RAVEmitHerz.li</a></li>
<li><a href="https://rumpelkist.li" target="_blank" rel="noopener">🛸 Rumpelkist.li</a></li>
</ul>
</div>
<div class="linkgroup linkgroup-everywhere">
<h4>👭 everywhere</h4>
<ul><li><a href=https://ausliebemusik.ch target=_blank>Aus Liebe</a></li></ul>
<ul><li><a href=https://instagram.com/catcallsofzrh target=_blank>Catcalls of Zurich</a></li></ul>
<ul><li><a href=https://marcp.xyz target=_blank>cramp</a></li></ul>
<ul><li><a href=https://le-lan.ch target=_blank>LeLAN</a></li></ul>
<ul><li><a href=https://jar.band target=_blank>JAR</a></li></ul>
<ul>
<li><a href="https://ausliebemusik.ch" target="_blank" rel="noopener">» Aus Liebe</a></li>
<li><a href="https://catcallsofzuri.ch" target="_blank" rel="noopener">» Catcalls of Zurich</a></li>
<li><a href="https://cannamatch.cannabis-research.ch" target="_blank" rel="noopener">» Cannamatch</a></li>
<li><a href="https://marcp.xyz" target="_blank" rel="noopener">» cramp</a></li>
<li><a href="https://jar.band" target="_blank" rel="noopener">» JAR</a></li>
<li><a href="https://le-lan.ch" target="_blank" rel="noopener">» LeLAN</a></li>
</ul>
</div>
</section>
</br>
<details class="things-block" id="qlpycon-details">
<summary>👾 qlpycon</summary>
<div class="contentindexqlpycon">
<pre id="qlpyconbanner">
<script src="js/qlpyconbanner.js" defer></script>
</pre>
<h1 class="">QLPyCon</h1>
<h2 class="">Quake Live Python Console</h2>
<h3 class="">Terminal-based client written in python for monitoring and controlling Quake Live servers via ZMQ</h3>
<div id="qlpycon"></div>
<script src="js/qlpycon.js"></script>
<script>QuakeTerminal.init('#qlpycon')</script>
<p class="">- Real-time server monitoring with live feed of game events</p>
<p class="">- Server info display and full control via rcon</p>
<p class="">- Autocomplete cvars and commands with fuzzy matching</p>
<p class="">- Intelligent argument suggestions for 25+ commands</p>
<p class="">- Quake color code support (^0-^7)</p>
<p class="">- Command history & JSON event capture</p>
<br>
<p class="">License: <a href="https://www.wtfpl.net/" target="_blank" rel="noopener">WTFPL</a></p>
<br>
<h4 class="">pipe2bash (stable):</h4>
<div class="qlpyconcodeblock">
<p class="qlpyconcode">curl -sSL https://git.6bit.ch/xbl/qlpycon/raw/branch/main/install.sh | bash</p>
</div>
<div class="col right">
<section class=contentindex>
<img src=img/gosu.png>
<p>The trajectory of this <a href=https://wikipedia.org/wiki/Earth target=_blank>ship</a> is unchanging.</p>
<form method="get" id="ddgSearch" action="https://duckduckgo.com/">
<input type="text" name="q" placeholder="DuckDuck">
<button type="submit">Go!</button>
</form>
</br>
</section>
<h4 class="">git clone (edge):</h4>
<div class="qlpyconcodeblock">
<p class="qlpyconcode">git clone https://git.6bit.ch/xbl/qlpycon.git</p>
<p class="qlpyconcode">cd qlpycon</p>
<p class="qlpyconcode">chmod u+x install.sh</p>
<p class="qlpyconcode">./install.sh</p>
</div>
</div>
<div id="" class="footer">
<p>Gmacht mit 🔮 z'Züri. | <a href=humans.txt>humans.txt</a></p>
</details>
<details class="things-block" id="things-details">
<summary>🎨 Things</summary>
<div class="contentindexart">
<div class="artitem">
<a href="art/clicktoris.png" target="_blank"><img data-src="art/clicktoris.png" alt="clicktoris.org"></a>
<p>clicktoris.org</p>
<p class="artdesc">image, logo</p>
</div>
<div class="artitem">
<a href="art/hb.png" target="_blank"><img data-src="art/hb.png" alt="Hardbrugg.ch"></a>
<p>Hardbrugg.ch</p>
<p class="artdesc">image, logo</p>
</div>
<div class="artitem">
<a href="art/lelogo.png" target="_blank"><img data-src="art/lelogo.png" alt="LeLAN"></a>
<p>LeLAN</p>
<p class="artdesc">image, logo</p>
</div>
<div class="break"></div>
<div class="artitem">
<a href="art/raverave.png" target="_blank"><img data-src="art/raverave.png" alt="RAVE Rave"></a>
<p>RAVE Rave</p>
<p class="artdesc">image, postcard</p>
</div>
<div class="artitem">
<a href="art/rerave.png" target="_blank"><img data-src="art/rerave.png" alt="RAVE Re-Rave"></a>
<p>RAVE Re-Rave</p>
<p class="artdesc">image, postcard</p>
</div>
<div class="artitem">
<a href="art/fbn.png" target="_blank"><img data-src="art/fbn.png" alt="RAVE Fernbedienung Nebel"></a>
<p>RAVE Fernbedienung Nebel</p>
<p class="artdesc">image, postcard</p>
</div>
<div class="artitem">
<a href="art/bsin.png" target="_blank"><img data-src="art/bsin.png" alt="RAVE Blazerstuhl des Lebens"></a>
<p>RAVE Blazerstuhl des Lebens</p>
<p class="artdesc">image, postcard</p>
</div>
<div class="artitem">
<a href="art/dgk.png" target="_blank"><img data-src="art/dgk.png" alt="RAVE Durchgangskonzept"></a>
<p>RAVE Durchgangskonzept</p>
<p class="artdesc">image, postcard</p>
</div>
<div class="break"></div>
<div class="artitem">
<a href="art/ccofz.png" target="_blank"><img data-src="art/ccofz.png" alt="C of Z"></a>
<p>C of Z</p>
<p class="artdesc">image, sticker</p>
</div>
<div class="artitem">
<a href="art/1312.png" target="_blank"><img data-src="art/1312.png" alt="Gleis 1312"></a>
<p>Gleis 1312</p>
<p class="artdesc">image, sticker</p>
</div>
<div class="artitem">
<a href="art/grzh.png" target="_blank"><img data-src="art/grzh.png" alt="GrZH"></a>
<p>GrZH</p>
<p class="artdesc">image, sticker</p>
</div>
<div class="artitem">
<a href="art/plan.png" target="_blank"><img data-src="art/plan.png" alt="planlos"></a>
<p>planlos</p>
<p class="artdesc">image, sticker</p>
</div>
<div class="artitem">
<a href="art/viv.png" target="_blank"><img data-src="art/viv.png" alt="ViV"></a>
<p>ViV</p>
<p class="artdesc">image, sticker</p>
</div>
<div class="artitem">
<a href="art/zbb.png" target="_blank"><img data-src="art/zbb.png" alt="ZBB"></a>
<p>ZBB</p>
<p class="artdesc">image, sticker</p>
</div>
<div class="break"></div>
<div class="artitem">
<a href="art/alho100.png" target="_blank"><img data-src="art/alho100.png" alt="AlHo100"></a>
<p>AlHo100</p>
<p class="artdesc">image, money</p>
</div>
<div class="artitem">
<a href="art/donot.png" target="_blank"><img data-src="art/donot.png" alt="don't blender"></a>
<p>don't blender</p>
<p class="artdesc">image, 3d</p>
</div>
<div class="artitem">
<a href="https://www.youtube.com/watch?v=lMSjd6HNQdY" target="_blank" rel="noopener"><img src="art/eve.png" alt="EVE Online FaLiHSS"></a>
<p>EVE Online FaLiHSS (2006)</p>
<p class="artdesc">video, youtube</p>
</div>
<div class="artitem">
<a href="art/pp.pdf" target="_blank"><img data-src="art/pp.png" alt="Postparade"></a>
<p>Postparade</p>
<p class="artdesc">pdf, text</p>
</div>
</div>
</details>
<details class="things-block" id="snek-details">
<summary>🐍 Snek (arrow keys required)</summary>
<canvas id="game"></canvas>
</details>
<div class="footer">
<p>Gmacht mit 🔮 z'Züri. | <a href="humans.txt">humans.txt</a></p>
</div>
</div>
<canvas id="particles"></canvas>
<canvas id="stars"></canvas>
<script src="js/art.js"></script>
<script src="js/helpers.js"></script>
<script src="js/hdr.js"></script>
<script src="js/particles.js"></script>
<script src="js/snek.js"></script>
<script src="js/stars.js"></script>
</body>
</html>

369
html/js/art.js Normal file
View File

@ -0,0 +1,369 @@
const ARTS = [
{
lines: [
' ____________________________________________________________________________',
' ___/\\/\\/\\/\\____/\\/\\________/\\/\\______/\\/\\________________________/\\/\\_______',
' _/\\/\\__________/\\/\\________________/\\/\\/\\/\\/\\__________/\\/\\/\\/\\__/\\/\\_______',
' _/\\/\\/\\/\\/\\____/\\/\\/\\/\\____/\\/\\______/\\/\\____________/\\/\\________/\\/\\/\\/\\___',
' _/\\/\\____/\\/\\__/\\/\\__/\\/\\__/\\/\\______/\\/\\______/\\/\\__/\\/\\________/\\/\\__/\\/\\_',
' ___/\\/\\/\\/\\____/\\/\\/\\/\\____/\\/\\/\\____/\\/\\/\\____/\\/\\____/\\/\\/\\/\\__/\\/\\__/\\/\\_',
'____________________________________________________________________________'
]
},
{
lines: [
' @@@@@@ @@@@@@@ @@@ @@@@@@@ @@@@@@@ @@@ @@@ ',
' @@@@@@@ @@@@@@@@ @@@ @@@@@@@ @@@@@@@@ @@@ @@@ ',
'!@@ @@! @@@ @@! @@! @@@ @@! @@@ ',
'!@! !@ @!@ !@! !@! !@! !@! @!@ ',
'!!@@!@! @!@!@!@ !!@ @!! !@! @!@!@!@! ',
'@!!@!!!! !!!@!!!! !!! !!! !!! !!!@!!!! ',
'!:! !:! !!: !!! !!: !!: :!! !!: !!! ',
':!: !:! :!: !:! :!: :!: :!: :!: :!: !:! ',
':::: ::: :: ::: :: :: ::: ::: ::: :: ::: ',
' :: : : : : :: : : : :: :: : : :: '
]
},
{
lines: [
' _____ _____ _____ _____ _____ _____ _____ ',
'|| ||| ||| ||| ||| ||| ||| ||',
'|| 6 ||| B ||| I ||| T ||| . ||| C ||| H ||',
'||_____|||_____|||_____|||_____|||_____|||_____|||_____||',
'|/_____\\|/_____\\|/_____\\|/_____\\|/_____\\|/_____\\|/_____\\|'
]
},
{
lines: [
' o__ __o o o o o ',
' /v v\\ <|> _<|>_ <|> <|> ',
' /> <\\ / > < > / > ',
'<o> \\o__ __o o | __o__ \\o__ __o ',
' |__ _\\__o__ | v\\ <|> o__/_ /> \\ | v\\ ',
' | \\ / \ <\\ / \\ | o/ / \\ <\\',
' \\ / \\o/ / \\o/ | o <| \\o/ o/',
' o o | o | o <|> \\\\ | <| ',
' <\\__ __/> / \\ __/> / \\ <\\__ < > _\\o__</ / \\ / \\'
]
},
{
lines: [
' d88b 8 w w 8 ',
'8Pwww. 88b. w w8ww .d8b 8d8b.',
'8b d8 8 8 8 8 8 8P Y8',
'`Y88P\' 88P\' 8 Y8P w `Y8P 8 8'
]
},
{
lines: [
' ___ _ ___ ___ ___ ___ ',
' .\'|=|_.\' .\'|=| `. .\'| `._|=| |=|_.\' .\'|=|_.\' .\'| |`. ',
'.\' | .\' | | .\' .\' | | | .\' | .\' | | `.',
'| |=|`. | |=|\'. | | | | | | | |=| |',
'| | | | | | | | | | `. | .-. `. | ___ | | | |',
'|___|=|__| |___|=|_.\' |___| `.| `-\' `.|=|_.\' |___| |___|'
]
},
{
lines: [
'. . . . . . . . . . . . ',
'|`+.=|`+. .+\'|=|`+. |`+. .+\'|=|`+.=|`+. .+\'|=|`+. .+\'| |`+.',
'| | `+.| | | | | | | |.+\' | | `+.| | | `+.| | | | |',
'| | . | |\'. \'. | | | | | | | |=| |',
'| |=|`+. | | | | | | | | | | | | | |',
'| | | | | | | | | | | | . | | . | | | |',
'| | | | | | | | | | | | |`+. | | .+\'| | | | |',
'`+.|=|.+\' `+.|=|.+\' |.+\' |.+\' `+.| `+.|=|.+\' `+.| |.+\''
]
},
{
lines: [
' _______ __ __ __ __ ',
'| | |--|__| |_ .----| |--.',
'| ____| _ | | _|__| __| |',
'|. \\|_____|__|____|__|____|__|__|',
'|: o | ',
'|::.. . | ',
'`-------\' '
]
},
{
lines: [
'__ ___ ____ ___ _________ __ ___ _',
' / __) \\ \\ (_ _) (__ __) / __) \\ | | / ',
'| (__ | ) | | | | | / | \\_/ | ',
'| \\ | < | | | | | | | _ | ',
'| ) | ) _| |_ | | __ | \\__ | / \\ | ',
'_\\ /__/ /__( )____| |____( )__\\ )_/ |___| \\_'
]
},
{
lines: [
' _ _ _ _ __ ',
'| |__ ___ | |_(_) |__ / /_ ',
'| \'_ \\ / __|| __| | \'_ \\| \'_ \\ ',
'| | | | (__ | |_| | |_) | (_) |',
'|_| |_|\\___(_)__|_|_.__/ \\___/ '
]
},
{
lines: [
' .-. .----. .-..-----. .----..-. .-.',
' / /. | {_} }| }`-\' \'-\' | }`-\'| {_} }',
'{ {} }| {_} }| } } { _ | },-.| { } }',
' `--\' `----\' `-\' `-\'{_}`----\'`-\' `-\''
]
},
{
lines: [
' ___________. .__ __ .__ ',
' / _____/\\_ |__ |__|/ |_ ____ | |__ ',
'/ __ \\ | __ \\| \\ __\\ _/ ___\\| | \\ ',
'\\ |__\\ \\ | \\_\\ \\ || | \\ \\___| Y \\',
' \\_____ / |___ /__||__| /\\ \\___ >___| /',
' \\/ \\/ \\/ \\/ \\/ '
]
},
{
lines: [
'.eeeeee..eeeeeee..eee.eeeeeeeee......eeeee.eee..eee.',
'@@@@@@@@:@@@@@@@@:@@@:@@@@@@@@@:::::@@@@@@:@@@::@@@:',
'%%%------%%%--%%%-%%%----%%%--------%%%----%%%--%%%-',
'&&&&&&&++&&&&&&&++&&&++++&&&++++++++&&&++++&&&&&&&&+',
'||||||||*||||||||*|||****|||********|||****||||||||*',
'!!!==!!!=!!!==!!!=!!!====!!!========!!!====!!!==!!!=',
'::::::::#::::::::#:::####:::####:::#::::::#:::##:::#',
'@......@@.......@@...@@@@...@@@@...@@.....@...@@...@'
]
},
{
lines: [
'`Yb .d .d `Yb. ',
' `8 db P\' P\' `Yb ',
' 8 Yb ',
' 88888888888b. `Yb d88b d88b \'Yb `Yb.d888b .dP\' dP\' Yb ',
' 8 .P\' .P\' 88P 8Y 8b 88 88\' 8Y 88 88 dPYb ',
' .P 8 8 b 88 8P 88 88 88 8P .d .d Y8 .88 ,dP Yb ',
' .P\' `Ybd`YbwP\' 88 .dP\' .dP\' .8P 88 ,dP P\' P\' `Y88P\'88 .dP\' `Yb.',
' 8 b 888888888888b. 88 88 ',
' `YbwP\' 88 88 88 ',
' .8P .8P Y8. '
]
},
{
lines: [
'#### #### # # ##### # # # #',
'# # # ## # # # # # ',
'#### #### # # # # #### # ',
'# # # # ## # # # # # ',
'#### ##### # # # # # # #'
]
},
{
lines: [
' _____ __ _ __ __ ',
' / ___// /_ (_) /_ _____/ /_ ',
' / __ \\/ __ \\/ / __// ___/ __ \\',
'/ /_/ / /_/ / / /__/ /__/ / / /',
'\\____/_.___/_/\\__(_)___/_/ /_/ '
]
},
{
lines: [
' _ _ _ _ _ _ _ ',
' _(_)(_)(_) (_) (_) (_) (_) ',
' _(_) (_) _ _ _ _ _ _ (_) _ _ _ _ _ (_) _ _ _ ',
'(_) _ _ _ (_)(_)(_)(_)_ (_)(_)(_)(_)(_)(_) _(_)(_)(_)(_)(_)(_)(_)_ ',
'(_)(_)(_)(_)_ (_) (_) (_) (_) (_) (_) (_)',
'(_) (_)(_) (_) (_) (_) _ _ _ (_) (_) (_)',
'(_)_ _ _ (_)(_) _ _ _(_) _ (_) _ (_)_ _(_) (_)(_) (_)_ _ _ (_) (_)',
' (_)(_)(_) (_)(_)(_)(_) (_)(_)(_) (_)(_) (_)(_) (_)(_)(_)(_) (_)'
]
},
{
lines: [
' {__ {__ ',
' {__ {__ {__ {__ {__ ',
' {__ {__ {_{_ {_ {__ ',
' {__ {__ {__ {__ {__ {___{__{_ ',
'{_ {__ {__ {__{__ {__ {__ {__ {__',
'{__ {__{__ {__{__ {__ {__ {__ {__',
' {___{__ {___{__ {__ {___{__{___{__ {__'
]
},
{
lines: [
' `.. `.. ',
' `.. `.. `. `.. `.. ',
' `.. `.. .`. `. `...`.. ',
' `.. `.. `.. `.. `.. `.. `. `. ',
'`. `.. `.. `..`.. `.. `.. `.. `..',
'`.. `..`.. `. `.. `.. `.. `. `..',
' `.. ..` `.. ..` `.. `.. `.. `...`.. `..'
]
},
{
lines: [
' :::::::: ::::::::: ::::::::::::::: :::::::: ::: :::',
':+: :+: :+: :+: :+: :+: :+: :+: :+: :+:',
'+:+ +:+ +:+ +:+ +:+ +:+ +:+ +:+',
'+#++:++#+ +#++:++#+ +#+ +#+ +#+ +#++:++#++',
'+#+ +#+ +#+ +#+ +#+ +#+ +#+ +#+ +#+',
'#+# #+# #+# #+# #+# #+# #+# #+# #+# #+# #+#',
' ######## ######### ####### ### ### ######## ### ###'
]
},
{
lines: [
' dD d8888b. d888888b d888888b .o88b. db db',
' d8\' 88 `8D `88\' `~~88~~\' d8P Y8 88 88',
' d8\' 88oooY\' 88 88 8P 88ooo88',
'd8888b. 88~~~b. 88 88 8b 88~~~88',
'88\' `8D 88 8D .88. 88 db Y8b d8 88 88',
'`8888P Y8888P\' Y888888P YP VP `Y88P\' YP YP'
]
},
{
lines: [
'-....',
'-...',
'..',
'-',
'.-.-.-',
'-.-.',
'....'
]
},
{
lines: [
' ████████ █████ ███ █████ █████ ',
' ███░░░░███░░███ ░░░ ░░███ ░░███ ',
'░███ ░░░ ░███████ ████ ███████ ██████ ░███████ ',
'░█████████ ░███░░███░░███ ░░░███░ ███░░███ ░███░░███ ',
'░███░░░░███ ░███ ░███ ░███ ░███ ░███ ░░░ ░███ ░███ ',
'░███ ░███ ░███ ░███ ░███ ░███ ███ ░███ ███ ░███ ░███ ',
'░░████████ ████████ █████ ░░█████ ██░░██████ ████ █████',
' ░░░░░░░░ ░░░░░░░░ ░░░░░ ░░░░░ ░░ ░░░░░░ ░░░░ ░░░░░ '
]
},
{
lines: [
' _ _ _ _ _ _ _ ',
' /\\ \\ / /\\ /\\ \\ /\\ \\ /\\ \\ / /\\ / /\\',
' / \\ \\ / / \\ \\ \\ \\ \\_\\ \\ / \\ \\ / / / / / /',
' / /\\ \\_\\ / / /\\ \\ /\\ \\_\\ /\\__ \\ / /\\ \\ \\ / /_/ / / / ',
' / / /\\/_/ / / /\\ \\ \\ / /\\/_/ / /_ \\ \\ / / /\\ \\ \\ / /\\ \\__/ / / ',
' / /_/_ / / /\\ \\_\\ \\ / / / / / /\\ \\ \\ / / / \\ \\_\\ / /\\ \\___\\/ / ',
' / /___/\\ / / /\\ \\ \\___\\ / / / / / / \\/_// / / \\/_/ / / /\\/___/ / ',
' / /\\__ \\ \\ / / / \\ \\ \\__/ / / / / / / / / / / / / / / / ',
' / / /__\\ \\ \\ / / /____\\_\\ \\ ___/ / /__ / / /_ / / /________ / / / / / / ',
'/ / /____\\ \\ \\/ / /__________\\/\\__\\/_/___\\/_/ //\\_\\ / / /_________\\/ / / / / / ',
'\\/__________\\/\\/_____________/\\/_________/\\_\\/ \\/_/ \\/____________/\\/_/ \\/_/ ',
]
},
{
lines: [
'_|_|_| _| _| _| _| ',
'_| _|_|_| _|_|_|_| _|_|_| _|_|_| ',
'_|_|_| _| _| _| _| _| _| _|',
'_| _| _| _| _| _| _| _| _|',
' _|_| _|_|_| _| _|_| _| _|_|_| _| _|'
]
},
{
lines: [
'┌┐┌┐ ┬┌┬┐┌─┐┬ ┬',
'┌┐┌┐ ┬┌┬┐┌─┐┬ ┬',
'├┐├┴┐│ │ │ ├─┤',
'└┘└─┘┴ ┴o└─┘┴ ┴',
'└┘└─┘┴ ┴o└─┘┴ ┴'
]
},
{
lines: [
' ██████╗ ██████╗ ██╗████████╗ ██████╗██╗ ██╗',
'██╔════╝ ██╔══██╗██║╚══██╔══╝██╔════╝██║ ██║',
'███████╗ ██████╔╝██║ ██║ ██║ ███████║',
'██╔═══██╗██╔══██╗██║ ██║ ██║ ██╔══██║',
'╚██████╔╝██████╔╝██║ ██║██╗╚██████╗██║ ██║',
' ╚═════╝ ╚═════╝ ╚═╝ ╚═╝╚═╝ ╚═════╝╚═╝ ╚═╝'
]
},
{
lines: [
'00110110',
'01100010',
'01101001',
'01110100',
'00101110',
'01100011',
'01101000',
]
},
{
lines: [
' .:. :::::::. ::::::::::::: .,-::::: :: .: ',
' ,;\' ;;;\'\'\';; ;;;\'\'\';;\'\'\' ,;;\'`````\' ,;; ;;, ',
',[[.od8b [[[__[[\\.[[[ [[ [[[ ,[[[,,,[[[ ',
'$$$" "$$ $$""""Y$$$$$ $$ $$$ "$$$"""$$$ ',
' Y8b,,d8P_88o,,od8P888 88 ,d8b`88bo,__,o,888 "88o',
' "YMP" ""YUMMMP" MMM MM MYMP "YUMMMMMP MM YMM'
]
},
{
lines: [
' _.._ ',
' .\' \'. ',
' ( / `\\ \\ ',
' ( |\' \' ) ) ',
' ) _\\- / ( ',
' __..---.(`_.\' ` \ ) ',
' `;-""-._(_( ♥ `;( ',
' / `-`\'--\' ; ) ',
' / / . ( ♥ ,| |( ',
' .-`\'---...__,\' /-,..___.-\'--\'_| |) ',
' \'-\'``\'-.._ ,\' |_ / .........\' ',
' ``;--"`; | ``` ',
' `\'..__.\' '
]
},
{
lines: [
' ♥ ',
' ♥ ♥',
'♥ ♥ ♥ ♥'
]
},
{
lines: [
' o ',
' @ ',
' @ ',
' @ ',
' o@o ',
' o@o ',
' o@o- o@o -o@o ',
' o@o @@@ o@o ',
'o@o @@@ o@o',
' o@o @@@ o@o ',
' o@@@@@@o @@@ o@@@@@@o ',
' o@@@@@@@@@@@@o @@@ o@@@@@@@@@@@@o ',
' o@@@@@@@@@@@@@@@@@o @@@ o@@@@@@@@@@@@@@@@@o ',
' o@@@@@@@@@o @@@ o@@@@@@@@@o ',
' o@@@o @@@ o@@@o ',
' @@@o @@@ o@@@ ',
' o@@@ @@@ @@@o ',
' @@@ @@@ @@@ ',
' o@@ @@@ @@o ',
' @@ o@o @@ ',
' o@ o@o @o ',
' @ o@o @ ',
' @ @ @ ',
' o @ o ',
' o ',
' o '
]
},
];

190
html/js/hdr.js Normal file
View File

@ -0,0 +1,190 @@
(function () {
var c = document.getElementById('hdr');
var ctx = c.getContext('2d');
var W, H, mouse = { x: -999, y: -999 };
var glitchX = 0, glitchY = 0;
var glitchXTarget = 0, glitchYTarget = 0;
var COLS = ['#00ffff', '#ff00ff', '#ffffff'];
/*const ARTS = [
{
lines: [
''
]
},
]*/
var validARTS = ARTS.filter(function(a) { return a.lines.length > 0; });
var ART = validARTS[Math.floor(Math.random() * validARTS.length)].lines;
var fontSize, LINE_H, ART_TOP, PAD_BOTTOM;
function resize() {
W = c.width = c.offsetWidth;
var maxChars = ART.reduce(function(max, l) { return Math.max(max, l.length); }, 0);
fontSize = Math.min(16, (W * 0.95) / maxChars * 1.6);
LINE_H = fontSize * 1;
ART_TOP = LINE_H * 2;
PAD_BOTTOM = LINE_H * 2;
H = c.height = Math.ceil(ART_TOP + ART.length * LINE_H + PAD_BOTTOM);
buildScanlines();
}
var scanlines = document.createElement('canvas');
function buildScanlines() {
var headerH = ART_TOP + ART.length * LINE_H + PAD_BOTTOM;
scanlines.width = 1;
scanlines.height = headerH;
var sctx = scanlines.getContext('2d');
sctx.clearRect(0, 0, 1, headerH);
for (var sy = 0; sy < headerH; sy += 3) {
sctx.fillStyle = '#101010';
sctx.fillRect(0, sy, 1, 1);
}
}
window.addEventListener('resize', function () { resize(); });
window.addEventListener('DOMContentLoaded', function() {
resize();
requestAnimationFrame(loop);
});
var moveTimer;
var glitchTarget = 0;
var lastX = 0, lastY = 0;
document.addEventListener('mousemove', function (e) {
var nx = e.clientX;
var ny = e.clientY;
var dx = nx - lastX;
var dy = ny - lastY;
mouse.x = nx;
mouse.y = ny;
lastX = nx;
lastY = ny;
glitchXTarget = Math.min(1, Math.abs(dx) / 16);
glitchYTarget = Math.min(1, Math.abs(dy) / 16);
clearTimeout(moveTimer);
moveTimer = setTimeout(function () { glitchXTarget = 0; glitchYTarget = 0; }, 100);
});
document.addEventListener('mouseleave', function () {
mouse.x = -999;
glitchXTarget = 0;
glitchYTarget = 0;
});
document.addEventListener('touchmove', function (e) {
var touch = e.touches[0];
var nx = touch.clientX;
var ny = touch.clientY;
var dx = nx - lastX;
var dy = ny - lastY;
mouse.x = nx;
mouse.y = ny;
lastX = nx;
lastY = ny;
glitchXTarget = Math.min(1, Math.abs(dx) / 16);
glitchYTarget = Math.min(1, Math.abs(dy) / 16);
clearTimeout(moveTimer);
moveTimer = setTimeout(function () { glitchXTarget = 0; glitchYTarget = 0; }, 100);
}, { passive: true });
document.addEventListener('touchend', function () {
glitchXTarget = 0;
glitchYTarget = 0;
});
/* ── text ── */
function drawText(ox, oy, col, alpha) {
ctx.save();
ctx.globalAlpha = alpha;
ctx.fillStyle = col;
ctx.font = fontSize + 'px deltarune';
ctx.textAlign = 'center';
ctx.textBaseline = 'top';
for (var i = 0; i < ART.length; i++) {
ctx.fillText(ART[i], W / 2 + ox, ART_TOP + i * LINE_H + oy, W * 0.95);
}
ctx.restore();
}
/* ── proximity glow on letters ── */
function drawGlow() {
var cx = W / 2;
var cy = ART_TOP + (ART.length * LINE_H) / 2;
var dx = mouse.x - cx;
var dy = mouse.y - cy;
var dist = Math.sqrt(dx * dx + dy * dy);
var r = Math.max(0, 1 - dist / 220);
var idle = (1 - r) * (Math.sin(t * 0.008) * 0.5 + 0.5) * 0.25;
if (idle > 0) {
ctx.save();
ctx.globalAlpha = idle * 0.15;
ctx.fillStyle = '#00ffff';
ctx.font = fontSize + 'px deltarune';
ctx.textAlign = 'center';
ctx.textBaseline = 'top';
for (var d = 3; d <= 9; d += 3) {
for (var i = 0; i < ART.length; i++) {
ctx.fillText(ART[i], W / 2 + d, ART_TOP + i * LINE_H, W * 0.95);
ctx.fillText(ART[i], W / 2 - d, ART_TOP + i * LINE_H, W * 0.95);
ctx.fillText(ART[i], W / 2, ART_TOP + i * LINE_H + d, W * 0.95);
ctx.fillText(ART[i], W / 2, ART_TOP + i * LINE_H - d, W * 0.95);
}
}
ctx.restore();
}
if (r <= 0) return;
ctx.save();
ctx.globalAlpha = r * 0.3;
ctx.fillStyle = '#ff00ff';
ctx.font = fontSize + 'px deltarune';
ctx.textAlign = 'center';
ctx.textBaseline = 'top';
for (var d = 3; d <= 9; d += 3) {
for (var i = 0; i < ART.length; i++) {
ctx.fillText(ART[i], W / 2 + d, ART_TOP + i * LINE_H, W * 0.95);
ctx.fillText(ART[i], W / 2 - d, ART_TOP + i * LINE_H, W * 0.95);
}
}
ctx.restore();
}
/* ── main loop ── */
var t = 0, lastFrame = 0;
function loop(ts) {
requestAnimationFrame(loop);
if (ts - lastFrame < 42) return;
lastFrame = ts;
t++;
ctx.clearRect(0, 0, W, H);
var headerH = ART_TOP + ART.length * LINE_H + PAD_BOTTOM;
var splitX = glitchX * 16;
var splitY = glitchY * 16;
drawText(-splitX, -splitY, '#00ffff', 0.7);
drawText( splitX, splitY, '#ff00ff', 0.7);
drawText(0, 0, '#ffffff', 0.9);
drawGlow();
/* scanline overlay */
var headerH = ART_TOP + ART.length * LINE_H + PAD_BOTTOM;
ctx.drawImage(scanlines, 0, 0, W, headerH);
glitchX += (glitchXTarget - glitchX) * 0.04;
glitchY += (glitchYTarget - glitchY) * 0.04;
}
window.rerollArt = function() {
ART = validARTS[Math.floor(Math.random() * validARTS.length)].lines;
resize();
};
})();

178
html/js/hearts.js Executable file
View File

@ -0,0 +1,178 @@
//var colours=new Array('#f00', '#f06', '#f0f', '#f6f', '#f39', '#f9c'); // colours of the hearts
var colours=new Array('#ff00ff','#00ffff'); // colours of the hearts
var minisize=10; // smallest size of hearts in pixels
var maxisize=20; // biggest size of hearts in pixels
var hearts=100; // maximum number of hearts on screen
var over_or_under="over"; // set to "over" for hearts to always be on top, or "under" to allow them to float behind other objects
/* Thanks mf2fm.com for this
*
*/
/*****************************
*JavaScript Love Heart Cursor*
* (c)2013+ mf2fm web-design *
* http://www.mf2fm.com/rv *
* DON'T EDIT BELOW THIS BOX *
*****************************/
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var herz=new Array();
var herzx=new Array();
var herzy=new Array();
var herzs=new Array();
var kiss=true;
if (typeof('addRVLoadEvent')!='function') function addRVLoadEvent(funky) {
var oldonload=window.onload;
if (typeof(oldonload)!='function') window.onload=funky;
else window.onload=function() {
if (oldonload) oldonload();
funky();
}
}
addRVLoadEvent(mwah);
function mwah() { if (document.getElementById) {
var i, heart;
for (i=0; i<hearts; i++) {
heart=createDiv("auto", "auto");
heart.style.visibility="hidden";
heart.style.zIndex=(over_or_under=="over")?"1001":"0";
heart.style.color=colours[i%colours.length];
heart.style.pointerEvents="none";
if (navigator.appName=="Microsoft Internet Explorer") heart.style.filter="alpha(opacity=75)";
else heart.style.opacity=0.45;
heart.appendChild(document.createTextNode(String.fromCharCode(9829)));
document.body.appendChild(heart);
herz[i]=heart;
herzy[i]=false;
}
set_scroll();
set_width();
herzle();
}}
function herzle() {
var c;
if (Math.abs(x-ox)>1 || Math.abs(y-oy)>1) {
ox=x;
oy=y;
for (c=0; c<hearts; c++) if (herzy[c]===false) {
herz[c].firstChild.nodeValue=String.fromCharCode(9829);
herz[c].style.left=(herzx[c]=x-minisize/2)+"px";
herz[c].style.top=(herzy[c]=y-minisize)+"px";
herz[c].style.fontSize=minisize+"px";
herz[c].style.fontWeight='normal';
herz[c].style.visibility='visible';
herzs[c]=minisize;
break;
}
}
for (c=0; c<hearts; c++) if (herzy[c]!==false) blow_me_a_kiss(c);
setTimeout("herzle()", 30);
}
document.onmousedown=pucker;
document.onmouseup=function(){clearTimeout(kiss);};
function pucker() {
ox=-1;
oy=-1;
kiss=setTimeout('pucker()', 100);
}
function blow_me_a_kiss(i) {
herzy[i]-=herzs[i]/minisize+i%2;
herzx[i]+=(i%5-2)/5;
if (herzy[i]<sdown-herzs[i] || herzx[i]<sleft-herzs[i] || herzx[i]>sleft+swide-herzs[i]) {
herz[i].style.visibility="hidden";
herzy[i]=false;
}
else if (herzs[i]>minisize+1 && Math.random()<2.5/hearts) break_my_heart(i);
else {
if (Math.random()<maxisize/herzy[i] && herzs[i]<maxisize) herz[i].style.fontSize=(++herzs[i])+"px";
herz[i].style.top=herzy[i]+"px";
herz[i].style.left=herzx[i]+"px";
}
}
function break_my_heart(i) {
var t;
herz[i].firstChild.nodeValue=String.fromCharCode(9676);
herz[i].style.fontWeight='bold';
herzy[i]=false;
for (t=herzs[i]; t<=maxisize; t++) setTimeout('herz['+i+'].style.fontSize="'+t+'px"', 60*(t-herzs[i]));
setTimeout('herz['+i+'].style.visibility="hidden";', 60*(t-herzs[i]));
}
document.onmousemove=mouse;
function mouse(e) {
if (e) {
y=e.pageY;
x=e.pageX;
}
else {
set_scroll();
y=event.y+sdown;
x=event.x+sleft;
}
}
window.onresize=set_width;
function set_width() {
var sw_min=999999;
var sh_min=999999;
if (document.documentElement && document.documentElement.clientWidth) {
if (document.documentElement.clientWidth>0) sw_min=document.documentElement.clientWidth;
if (document.documentElement.clientHeight>0) sh_min=document.documentElement.clientHeight;
}
if (typeof(self.innerWidth)=='number' && self.innerWidth) {
if (self.innerWidth>0 && self.innerWidth<sw_min) sw_min=self.innerWidth;
if (self.innerHeight>0 && self.innerHeight<sh_min) sh_min=self.innerHeight;
}
if (document.body.clientWidth) {
if (document.body.clientWidth>0 && document.body.clientWidth<sw_min) sw_min=document.body.clientWidth;
if (document.body.clientHeight>0 && document.body.clientHeight<sh_min) sh_min=document.body.clientHeight;
}
if (sw_min==999999 || sh_min==999999) {
sw_min=800;
sh_min=600;
}
swide=sw_min;
shigh=sh_min;
}
window.onscroll=set_scroll;
function set_scroll() {
if (typeof(self.pageYOffset)=='number') {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body && (document.body.scrollTop || document.body.scrollLeft)) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height;
div.style.width=width;
div.style.overflow="hidden";
div.style.backgroundColor="transparent";
return (div);
}

7
html/js/helpers.js Normal file
View File

@ -0,0 +1,7 @@
document.querySelector('#things-details').addEventListener('toggle', function(e) {
if (!e.target.open) return;
e.target.querySelectorAll('img[data-src]').forEach(function(img) {
img.src = img.getAttribute('data-src');
img.removeAttribute('data-src');
});
});

9
html/js/particles.js Normal file
View File

@ -0,0 +1,9 @@
var pc = document.getElementById('particles');
var pctx = pc.getContext('2d');
function resizeParticlesCanvas() {
pc.width = window.innerWidth;
pc.height = window.innerHeight;
}
resizeParticlesCanvas();
window.addEventListener('resize', resizeParticlesCanvas);

262
html/js/qlpycon.js Normal file
View File

@ -0,0 +1,262 @@
(function (global) {
var DEFAULTS = {
host: 'tcp://10.13.12.93:28960',
serverLabel: '[+] sexy Test',
mapName: 'campgrounds',
gameType: 'Clan Arena',
playerSlots: '6/9',
roundLimit: 9,
redTeam: ['Angel', 'Crash', 'Hunter'],
blueTeam: ['Mynx', 'Slash', 'Lucy'],
weapons: ['Railgun', 'Rocket Launcher', 'Plasma Gun', 'Lightning Gun', 'Shotgun'],
medals: ['IMPRESSIVE', 'EXCELLENT', 'REVENGE', 'MIDAIR'],
chatMessages: ['So much for foreplay...', 'We do not lose. We blend in.', 'The she-wolf reigns', 'Konnichiwa, campers', 'Not what I expected. Definitely not.', 'Just a flesh wound', 'Sayonara, babies', 'Oooooo! You like me. You really like me!', 'This is, like, so sweet', 'We are off to find the lizard', 'Do it again. But this time, with feeling.', 'Bizzzzaap!! Got me like a bug in a zap trap!', 'You flesh folk leak too much', 'Toodles', 'Great, premature eradication', '** winks and blows kisses **', 'Drinks are on me, boys!' ],
minDelay: 420,
maxDelay: 6900,
maxLines: 12,
pKill: 0.69,
pMedal: 0.1337,
spectators: [ 'anarki' ],
};
var colorizedNames = {
'anarki': '<span style="color:#f00">a</span><span style="color:#0f0">n</span><span style="color:#ff0">a</span><span style="color:#09f">r</span><span style="color:#0cc">k</span><span style="color:#f0f">i</span>'
};
function colorizeSpectator(name) {
return colorizedNames[name.toLowerCase()] || name;
}
function buildDoc(cfg) {
var redRows = cfg.redTeam .map(function(p){ return '<div class="player">0 ' + p + '</div>'; }).join('');
var blueRows = cfg.blueTeam.map(function(p){ return '<div class="player">0 ' + p + '</div>'; }).join('');
var label = cfg.serverLabel.split(' ');
var bracket = label[0] || '';
var cyan = label[1] || '';
var yellow = label.slice(2).join(' ') || '';
var css = [
'*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}',
'html,body{background:transparent;color:#ccc;font-family:"Courier New",Courier,monospace;font-size:12.5px;line-height:1.5;overflow:hidden}',
'.wrap{border:1px solid #333}',
'.header{padding:6px 12px 4px}',
'.titlebar{color:#ccc;margin-bottom:6px}',
'.infoline{display:grid;grid-template-columns:auto auto auto auto;margin-bottom:1px}',
'.teams{padding:8px 12px 4px;display:flex}',
'.team{width:50%}',
'.team-hdr{margin-bottom:3px}',
'.player{color:#fff;padding-left:2px}',
'.spectators{padding:4px 12px 2px;color:#ff0;font-weight:bold}',
'.divider{border:none;border-top:1px solid #444;margin:6px 0 0;display:block}',
'.feed-wrap{height:256px;overflow:hidden;padding:4px 12px;position:relative}',
'.fade{position:absolute;top:4px;left:0;right:0;height:30px;background:linear-gradient(to bottom,#0c0c0c,transparent);pointer-events:none;z-index:2}',
'.feed{display:flex;flex-direction:column}',
'.msg{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transition:opacity .25s ease;line-height:1.6;display:block}',
'.msg.on{opacity:1}',
'.cmdline{border-top:1px solid #333;padding:4px 12px;display:flex;align-items:center;gap:4px;color:#ccc}',
'.cursor{display:inline-block;width:8px;height:14px;background:#ccc;vertical-align:middle;animation:blink 1s step-end infinite}',
'@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}',
'.cyan{color:#fff}.yellow{color:#0cc}.warmup{color:#f00}',
'.bold{color:#fff;font-weight:bold}',
'.rt{color:#f00;text-decoration:underline;font-weight:bold}',
'.bt{color:#09f;text-decoration:underline;font-weight:bold}',
'.score{color:#fff;font-weight:bold;margin-right:6px}',
'.ts{color:#ccc}.cr{color:#f00}.cb{color:#09f}.cp{color:#fff;font-weight:bold}',
'.cmt{color:#f0f;font-weight:bold}',
'.cst{color:#0c0;font-weight:bold}.css{color:#0f0}',
'.plain{color:#ccc}',
'.label{color:#ff0}',
].join('');
var html = [
'<!DOCTYPE html><html><head><meta charset="UTF-8">',
'<style>', css, '</style>',
'</head><body>',
'<div class="wrap">',
'<div class="header">',
'<div class="titlebar">Quake Live PyCon: ', cfg.host, '</div>',
'<div class="infoline">',
'<span><span class="label">Name: </span><span class="cr">[</span><span class="bold">+</span><span class="cr">]</span> <span class="cyan">', cyan, '</span> <span class="yellow">', yellow, '</span></span>',
'<span></span>',
'<span style="padding-left:5.7em"><span class="label">Time: </span><span class="bold" id="qtime">0:00</span></span>',
'<span style="padding-left:0.3em"><span class="label">Warmup: </span><span class="warmup">YES</span></span>',
'</div>',
'<div class="infoline">',
'<span><span class="label">Type: </span><span class="bold">', cfg.gameType, '</span></span>',
'<span><span class="label">Map: </span><span class="bold">', cfg.mapName, '</span></span>',
'<span><span class="label">Players: </span><span class="bold">', cfg.playerSlots, '</span></span>',
'<span><span class="label">Roundlimit: </span><span class="bold">', cfg.roundLimit, '</span></span>',
'</div>',
'</div>',
'<div class="teams">',
'<div class="team">',
'<div class="team-hdr"><span class="score" id="rs">0</span><span class="rt">RED TEAM</span></div>',
redRows,
'</div>',
'<div class="team">',
'<div class="team-hdr"><span class="score" id="bs">0</span><span class="bt">BLUE TEAM</span></div>',
blueRows,
'</div>',
'</div>',
'<div class="spectators">Spectators: <span class="cyan">' + cfg.spectators.map(colorizeSpectator).join(' ') + '</span></div>',
'<hr class="divider">',
'<div class="feed-wrap">',
'<div class="fade"></div>',
'<div class="feed" id="feed"></div>',
'</div>',
'<div class="cmdline">$ <span class="cursor"></span></div>',
'</div>',
].join('');
/* inner script as a real function — no string escaping needed */
function iframeScript(cfg) {
var feed = document.getElementById('feed');
var timeEl = document.getElementById('qtime');
var rsEl = document.getElementById('rs');
var bsEl = document.getElementById('bs');
var lines = [], elapsed = 0, scores = { red: 0, blue: 0 };
function rand(a) { return a[Math.floor(Math.random() * a.length)]; }
function randInt(a,b){ return a + Math.floor(Math.random() * (b - a + 1)); }
function sp(c, t) { return '<span class="' + c + '">' + t + '</span>'; }
function pad(n) { return n < 10 ? '0' + n : '' + n; }
function ts() {
var b = 33*60 + 34 + elapsed;
return '[' + pad(Math.floor(b/3600)) + ':' + pad(Math.floor((b%3600)/60)) + ':' + pad(b%60) + ']';
}
function kill() {
var rk = Math.random() < 0.5;
var k = rand(rk ? cfg.redTeam : cfg.blueTeam);
var v = rand(rk ? cfg.blueTeam : cfg.redTeam);
var w = rand(cfg.weapons);
var hp = randInt(25, 200);
if (Math.random() < 0.12) { if (rk) scores.red++; else scores.blue++; }
return sp('ts',ts()) + ' ' +
sp(rk?'cr':'cb', rk?'(RED)':'(BLUE)') + sp('cp', k) +
sp('plain', ' fragged ') +
sp(rk?'cb':'cr', rk?'(BLUE)':'(RED)') + sp('cp', v) +
sp('plain', ' with the ') +
(function(w){
var weaponColors = {
'Rocket Launcher':'#f33',
'Plasma Gun':'#f0f',
'Railgun':'#0f0',
'Lightning Gun':'#ff0',
'Shotgun':'#f60'
};
return '<span style="color:' + (weaponColors[w]||'#fff') + ';font-weight:bold">' + w + '</span>';
})(w) + ' ' +
sp('chp', '(' + hp + ' HP)');
}
function medal() {
var r = Math.random() < 0.5;
return sp('ts',ts()) + ' ' +
sp('cmt', '[MEDAL]') + ' ' +
sp(r?'cr':'cb', r?'(RED)':'(BLUE)') +
sp('cp', rand(r ? cfg.redTeam : cfg.blueTeam)) +
sp('plain', ' got ') +
(function(m){
var medalColors = {
'EXCELLENT':'#ff0',
'MIDAIR':'#0f0',
'IMPRESSIVE':'#0cc',
'REVENGE':'#f00'
};
return '<span style="color:' + (medalColors[m]||'#fff') + ';font-weight:bold">' + m + '</span>';
})(rand(cfg.medals));
}
function say() {
var r = Math.random() < 0.5;
return sp('ts',ts()) + ' ' +
sp('cst', '[SAY]') + ' ' +
sp(r?'cr':'cb', r?'(RED)':'(BLUE)') +
sp('cp', rand(r ? cfg.redTeam : cfg.blueTeam)) +
': ' + sp('css', rand(cfg.chatMessages));
}
function addLine(h) {
var d = document.createElement('div');
d.className = 'msg';
d.innerHTML = h;
feed.appendChild(d);
lines.push(d);
requestAnimationFrame(function(){ d.classList.add('on'); });
if (lines.length > cfg.maxLines) lines.shift().remove();
rsEl.textContent = scores.red;
bsEl.textContent = scores.blue;
}
function schedule() {
setTimeout(function() {
var r = Math.random();
if (r < cfg.pKill) addLine(kill());
else if (r < cfg.pKill + cfg.pMedal) addLine(medal());
else addLine(say());
schedule();
}, randInt(cfg.minDelay, cfg.maxDelay));
}
addLine(sp('plain', '*** '));
addLine(sp('plain', '*** QL PyCon Version 0.8.1 starting ***'));
addLine(sp('plain', 'Stats stream connected - ready for game events'));
setInterval(function() {
elapsed++;
var m = Math.floor(elapsed / 60), s = elapsed % 60;
timeEl.textContent = m + ':' + (s < 10 ? '0' : '') + s;
}, 1000);
setTimeout(schedule, 900);
}
var scriptBody = '(' + iframeScript.toString() + ')(' + JSON.stringify(cfg) + ')';
return html + '<scr' + 'ipt>' + scriptBody + '</scr' + 'ipt></body></html>';
}
var instanceCount = 0;
function mount(root, cfg) {
var iframe = document.createElement('iframe');
iframe.style.cssText = 'width:100%;height:100%;border:none;display:block;';
iframe.setAttribute('scrolling', 'no');
iframe.setAttribute('title', 'Quake Live terminal');
root.appendChild(iframe);
var doc = iframe.contentDocument || iframe.contentWindow.document;
doc.open();
doc.write(buildDoc(cfg));
doc.close();
}
global.QuakeTerminal = {
init: function(selector, userConfig) {
var root = typeof selector === 'string'
? document.querySelector(selector)
: selector;
if (!root) { console.warn('QuakeTerminal: element not found —', selector); return; }
var cfg = {};
for (var k in DEFAULTS) cfg[k] = DEFAULTS[k];
for (var k in (userConfig || {})) cfg[k] = userConfig[k];
cfg._id = ++instanceCount;
var details = root.closest('details');
if (details && !details.open) {
details.addEventListener('toggle', function onToggle() {
if (details.open) {
details.removeEventListener('toggle', onToggle);
mount(root, cfg);
}
});
} else {
mount(root, cfg);
}
},
defaults: DEFAULTS,
};
}(window));

35
html/js/qlpyconbanner.js Normal file
View File

@ -0,0 +1,35 @@
const text = `
_/
_/_/_/ _/ _/_/_/ _/ _/ _/_/_/ _/_/ _/_/_/
_/ _/ _/ _/ _/ _/ _/ _/ _/ _/ _/ _/
_/ _/ _/ _/ _/ _/ _/ _/ _/ _/ _/ _/
_/_/_/ _/ _/_/_/ _/_/_/ _/_/_/ _/_/ _/ _/
_/ _/ _/
_/ _/ _/_/
`;
function lerp(a, b, t) {
return a + (b - a) * t;
}
function color(t) {
const c1 = [0, 255, 255]; // cyan
const c2 = [255, 0, 255]; // magenta
const r = Math.round(lerp(c1[0], c2[0], t));
const g = Math.round(lerp(c1[1], c2[1], t));
const b = Math.round(lerp(c1[2], c2[2], t));
return `rgb(${r},${g},${b})`;
}
let out = "";
const lines = text.split("\n");
lines.forEach(line => {
for (let i = 0; i < line.length; i++) {
const t = i / Math.max(line.length - 1, 1);
out += `<span style="color:${color(t)}">${line[i] || " "}</span>`;
}
out += "<br/>";
});
document.getElementById("qlpyconbanner").innerHTML = out;

158
html/js/snek.js Normal file
View File

@ -0,0 +1,158 @@
var snekStarted = false;
document.querySelector('#snek-details').addEventListener('toggle', function(e) {
if (e.target.open && !snekStarted) {
snekStarted = true;
var canvas = document.getElementById('game');
var context = canvas.getContext('2d');
var grid = 8;
var count = 8;
var snake = {
x: 160,
y: 160,
// snake velocity. moves one grid length every frame in either the x or y direction
dx: grid,
dy: 0,
// keep track of all grids the snake body occupies
cells: [],
// length of the snake. grows when eating an apple
maxCells: 4
};
var cols = Math.floor(canvas.width / grid);
var rows = Math.floor(canvas.height / grid);
var apple = {
x: getRandomInt(0, cols) * grid,
y: getRandomInt(0, rows) * grid,
};
// get random whole numbers in a specific range
// @see https://stackoverflow.com/a/1527820/2124254
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min)) + min;
}
// game loop
function loop() {
requestAnimationFrame(loop);
// slow game loop to 15 fps instead of 60 (60/15 = 4)
if (++count < 11) {
return;
}
count = 0;
context.clearRect(0,0,canvas.width,canvas.height);
context.font = '9px sans-serif';
context.fillStyle = '#696969';
context.fillText(snake.maxCells, canvas.width - 20, 14);
// move snake by it's velocity
snake.x += snake.dx;
snake.y += snake.dy;
// wrap snake position
if (snake.x < 0) {
snake.x = (cols - 1) * grid;
}
else if (snake.x >= canvas.width) {
snake.x = 0;
}
if (snake.y < 0) {
snake.y = (rows - 1) * grid;
}
else if (snake.y >= canvas.height) {
snake.y = 0;
}
// keep track of where snake has been. front of the array is always the head
snake.cells.unshift({x: snake.x, y: snake.y});
// remove cells as we move away from them
if (snake.cells.length > snake.maxCells) {
snake.cells.pop();
}
// draw apple
context.fillStyle = 'cyan';
context.fillRect(apple.x, apple.y, grid-1, grid-1);
// draw snake one cell at a time
context.fillStyle = 'magenta';
snake.cells.forEach(function(cell, index) {
// drawing 1 px smaller than the grid creates a grid effect in the snake body so you can see how long it is
context.fillRect(cell.x, cell.y, grid-1, grid-1);
// snake ate apple
if (cell.x === apple.x && cell.y === apple.y) {
snake.maxCells++;
// canvas is 400x400 which is 25x25 grids
apple.x = getRandomInt(0, cols) * grid;
apple.y = getRandomInt(0, rows) * grid;
}
// check collision with all cells after this one (modified bubble sort)
for (var i = index + 1; i < snake.cells.length; i++) {
// snake occupies same space as a body part. reset game
if (cell.x === snake.cells[i].x && cell.y === snake.cells[i].y) {
snake.x = 160;
snake.y = 160;
snake.cells = [];
snake.maxCells = 4;
snake.dx = grid;
snake.dy = 0;
apple.x = getRandomInt(0, 25) * grid;
apple.y = getRandomInt(0, 25) * grid;
}
}
});
}
// listen to keyboard events to move the snake
document.addEventListener('keydown', function(e) {
if (document.getElementById('snek-details').open) {
if ([37, 38, 39, 40].indexOf(e.which) !== -1) {
e.preventDefault();
}
}
// prevent snake from backtracking on itself by checking that it's
// not already moving on the same axis (pressing left while moving
// left won't do anything, and pressing right while moving left
// shouldn't let you collide with your own body)
// left arrow key
if (e.which === 37 && snake.dx === 0) {
snake.dx = -grid;
snake.dy = 0;
}
// up arrow key
else if (e.which === 38 && snake.dy === 0) {
snake.dy = -grid;
snake.dx = 0;
}
// right arrow key
else if (e.which === 39 && snake.dx === 0) {
snake.dx = grid;
snake.dy = 0;
}
// down arrow key
else if (e.which === 40 && snake.dy === 0) {
snake.dy = grid;
snake.dx = 0;
}
});
// start the game
requestAnimationFrame(loop);
}
});

28
html/js/sparks.js Normal file
View File

@ -0,0 +1,28 @@
$(function() {
var body = $('#starshine'),
template = $('.template.shine'),
stars = 500,
sparkle = 50;
var size = 'small';
var createStar = function() {
template.clone().removeAttr('id').css({
top: (Math.random() * 100) + '%',
left: (Math.random() * 100) + '%',
webkitAnimationDelay: (Math.random() * sparkle) + 's',
mozAnimationDelay: (Math.random() * sparkle) + 's'
}).addClass(size).appendTo(body);
};
for(var i = 0; i < stars; i++) {
if(i % 2 === 0) {
size = 'small';
} else if(i % 3 === 0) {
size = 'medium';
} else {
size = 'large';
}
createStar();
}
});

85
html/js/stars.js Normal file
View File

@ -0,0 +1,85 @@
/* stars.js — static starry background for 6bit.ch
Requires a <canvas id="stars"> in your HTML:
position: fixed; inset: 0; width: 100%; height: 100%;
z-index: -2; pointer-events: none; */
(function () {
const canvas = document.getElementById('stars');
if (!canvas) return;
const ctx = canvas.getContext('2d');
/* ── CONFIG ───────────────────────────────────────────────────── */
const CONFIG = {
count: 280,
colorVariation: 1.0, // 0 = pure white, 1 = full spectral color
bgColor: '#101010',
};
/* ── PALETTE (stellar spectral classes) ──────────────────────── */
const PALETTE = [
[160, 190, 255], // deep blue (O/B)
[200, 220, 255], // blue-white (A)
[255, 244, 180], // yellow (F/G)
[255, 210, 140], // orange (K)
[255, 160, 120], // red-orange (M)
[140, 220, 255], // cyan-blue
[255, 230, 255], // violet-white
];
function randColor() {
const base = PALETTE[Math.floor(Math.random() * PALETTE.length)];
const m = CONFIG.colorVariation;
return base.map(c => Math.round(255 * (1 - m) + c * m));
}
let W, H;
function resize() {
W = canvas.width = window.innerWidth;
H = canvas.height = window.innerHeight;
draw();
}
function draw() {
if (CONFIG.bgColor) {
ctx.fillStyle = CONFIG.bgColor;
ctx.fillRect(0, 0, W, H);
} else {
ctx.clearRect(0, 0, W, H);
}
for (let i = 0; i < CONFIG.count; i++) {
const r = Math.random();
const size = r < 0.65
? 0.45 + Math.random() * 0.30
: r < 0.90
? 0.85 + Math.random() * 0.30
: 1.40 + Math.random() * 0.40;
const x = Math.random() * W;
const y = Math.random() * H;
const alpha = 0.35 + Math.random() * 0.65;
const [cr, cg, cb] = randColor();
/* soft halo on brighter stars */
if (size > 1.0) {
const halo = ctx.createRadialGradient(x, y, 0, x, y, size * 2.5);
halo.addColorStop(0, `rgba(${cr},${cg},${cb},${(alpha * 0.45).toFixed(3)})`);
halo.addColorStop(1, `rgba(${cr},${cg},${cb},0)`);
ctx.beginPath();
ctx.arc(x, y, size * 2.5, 0, Math.PI * 2);
ctx.fillStyle = halo;
ctx.fill();
}
/* star core */
ctx.beginPath();
ctx.arc(x, y, size, 0, Math.PI * 2);
ctx.fillStyle = `rgba(${cr},${cg},${cb},${alpha.toFixed(3)})`;
ctx.fill();
}
}
resize();
window.addEventListener('resize', resize);
})();

10
html/slamp.html
View File

@ -43,6 +43,14 @@
var color = document.getElementById("body");
color.style.backgroundColor = "#042069";
}
function changeColor1312() {
var color = document.getElementById("body");
color.style.backgroundColor = "#F1312F";
}
function changeColor161() {
var color = document.getElementById("body");
color.style.backgroundColor = "#FFF161";
}
</script>
</head>
<body id='body'>
@ -60,6 +68,8 @@
<button onclick="changeColor420();">420</button>
<button onclick="changeColor69();">69</button>
<button onclick="changeColor42069();">42069</button>
<button onclick="changeColor1312();">1312</button>
<button onclick="changeColor161();">161</button>
</br>
</br>
</br>

453
html/style.css
View File

@ -1,82 +1,69 @@
* {
margin: 0;
padding: 0;
font-family: "FiraSans", sans-serif;
font-family: "deltarune", monospace;
box-sizing: border-box;
}
body {
background-color: #101010;
padding: 0;
margin:0;
background-color: #101010
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
-webkit-user-select: none; /* Chrome, Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* old IE/Edge */
user-select: none; /* standard */
}
div {box-sizing: border-box;}
#hdr {
position: block;
top: 0;
left: 0;
width: 100%;
z-index: 999;
pointer-events: none;
}
#starshine {
position: absolute;
#stars {
position: fixed;
inset: 0;
width: 100%;
height: 100%;
z-index: -2;
pointer-events: none;
}
#particles {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -5;
overflow: hidden;
pointer-events: none;
z-index: 0;
}
.shine {
display: block;
position: absolute;
top: 50%;
left: 50%;
background-image: url(https://6bit.ch/spark.png);
background-repeat: no-repeat;
background-position:center;
background-size: 100% 100%;
overflow: hidden;
z-index: 2;
color: transparent;
-moz-opacity: 0.0;
opacity: 0.0;
animation: glitter 6s linear 0s infinite normal;
-webkit-animation: glitter 6s linear 0s infinite normal;
-moz-animation: glitter 8s linear 0s infinite normal;
-ms-animation: glitter 8s linear 0s infinite normal;
-o-animation: glitter 8s linear 0s infinite normal;
h1, h2, h3, h4, p {
color: #F0F0F0;
}
.shine.small {
width: 1px;
height: 1px;
.reroll-btn {
background: none;
border: none;
color: magenta;
font-size: 13px;
cursor: pointer;
opacity: 0.6;
padding: 4px 0;
}
.shine.medium {
width: 3px;
height: 3px;
}
.shine.large {
width: 5px;
height: 5px;
}
/*CSS3 keyframes for glittering effect*/
@-webkit-keyframes glitter {
0% {
-webkit-transform: scale(0.3) rotate(0deg);
opacity: 0;
}
25% {
-webkit-transform: scale(1) rotate(360deg);
.reroll-btn:hover {
opacity: 1;
}
50% {
-webkit-transform: scale(0.3) rotate(720deg);
opacity: 0;
}
100% {
-webkit-transform: scale(0.3) rotate(0deg);
opacity: 0;
}
}
.snake-box {
width: 99%;
@ -84,7 +71,6 @@ div {box-sizing: border-box;}
top: 0px;
text-align: center;
margin-bottom: 1%;
z-index: 500;
text-align: center;
margin-bottom: 1%;
border: 1px cyan dotted;
@ -92,11 +78,10 @@ div {box-sizing: border-box;}
.footer {
width: 100%;
color: #101010;
position: relative;
flex-shrink: 0;
text-align: center;
padding-top: 3%;
background-color: #101010;
padding: 15px;
margin-top: auto;
}
.footer p {
@ -122,18 +107,16 @@ div {box-sizing: border-box;}
}
.main {
max-width: 720px;
width: 100%;
height: auto;
}
.main:after {
content:"";
display: table;
clear: both;
display: flex;
flex-direction: column;
gap: 1.5rem;
padding-top: 1.5rem;
flex-grow: 1;
}
.col {
position: relative;
color: white;
}
@ -150,78 +133,24 @@ div {box-sizing: border-box;}
}
.left {
width: 15%;
float: left;
left: 3%;
}
.left h4 {
text-decoration: none;
padding-right: 50px;
padding-left: 5px;
padding-bottom: 2px;
margin-right: 0px;
margin-left: 0px;
margin-bottom: 3px;
color: #101010;
background: rgb(0,255,255);
background: linear-gradient(90deg, rgba(255,0,255,1) 0%, rgba(10,10,10,0) 100%);
font-size: 17px;
font-weight: 500;
}
.left ul {
display: flex;
width: auto;
padding: 5px;
color: #FFFFFF;
text-decoration: none;
padding-left: 15px;
font-size: 15px;
list-style-type: none;
}
.left li {
width: 100%;
text-decoration: none;
}
.left a {
color: #FFFFFF;
text-decoration: none;
display: block;
padding-top: 2px;
padding-bottom: 2px;
padding-left: 5px;
}
.left a:hover {
background: linear-gradient(90deg, rgba(255,0,255,0.2) 0%, rgba(10,10,10,0) 100%);
}
.right {
position: relative;
width: 69%;
float: left;
left: 7%;
.col-full {
grid-column: 1 / -1;
}
.contentindex {
padding: 3%;
width: 100%;
z-index: 2200;
text-align: left;
border: 1px;
border-style: dotted;
border-color: cyan;
text-align: center;
background-color: rgba(16, 16, 16, 0.69);
}
.contentindexart {
padding: 3%;
width: 100%;
z-index: 2200;
text-align: left;
border: 1px;
border-style: dotted;
@ -230,6 +159,69 @@ div {box-sizing: border-box;}
display: flex;
flex-wrap: wrap;
gap: 50px;
justify-content: center;
}
.contentindexqlpycon {
padding: 3%;
width: 100%;
border: 1px;
border-style: dotted;
border-color: cyan;
text-align: center;
}
.contentindexqlpycon pre {
font-size: 15px;
}
.contentindexqlpycon h1 {
padding: 1.25rem 0;
}
.contentindexqlpycon h2 {
padding: 1rem 0;
}
.contentindexqlpycon h3 {
padding: 1rem 0;
}
.contentindexqlpycon h4 {
text-align: left;
padding-top: 1rem;
}
.contentindexqlpycon p {
text-align: left;
}
.contentindexqlpycon a {
color: white;
text-decoration: none;
border-bottom: 1px dotted magenta;
}
.qlpyconcodeblock {
font-size: 14px;
border: 1px dotted #ff00ff;
margin: 1rem;
padding: 1rem 0.5rem;
}
.qlpyconcode {
padding: 2px 16px;
color: cyan;
font-size: 14px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
}
#qlpycon {
max-width: 672px;
height: 500px;
}
.contentindex img {
@ -242,9 +234,8 @@ div {box-sizing: border-box;}
}
.contentindex p {
margin-top: 5px;
margin-bottom: 5px;
padding-bottom: 25px;
margin-top: 0px;
margin-bottom: 0px;
}
.contentindex a {
@ -291,100 +282,138 @@ div {box-sizing: border-box;}
}
}
#@-webkit-keyframes glow {
# from {
# text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
# }
#
# to {
# text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
# }
#}
@font-face {
font-family: FiraSans;
src: url("fonts/FiraSans-Medium.otf") format: ("opentype");
}
@media(max-width: 1350px) {
.main {
overflow: hidden;
padding: 0;
margin: 0;
}
.headerimg {
width 248px;
margin-left: 5%;
margin-right: 5%;
text-align: center;
}
.headerimg img {
display: block;
position: center;
margin: 0;
padding-top: 33px;
padding-bottom: 33px;
height: 80px;
width: auto;
height: auto;
max-height: 69px;
margin: auto;
margin: 0 auto;
}
.col {
overflow: hidden;
width: 100%;
left: 0;
right: 0;
.linksblock {
display: grid;
gap: 1.5rem;
border: 1px dotted magenta;
padding: 1rem 1.25rem;
justify-content: center;
grid-template-columns: 1fr 1fr;
background-color: rgba(16, 16, 16, 0.69);
}
.left {
overflow: hidden;
width: 100%;
.linkgroup {
flex: 1;
}
.navblock h4 {
font-size: 14px;
.linkgroup-everywhere {
grid-column: 1 / -1;
}
.navblock ul {
font-size: 14px;
}
.right {
overflow: hidden;
margin-top: 100px;
border: 1px cyan dotted;
width: 100%;
overflow: hidden;
}
.contentindex {
overflow: hidden;
border: none;
padding: 0;
margin: 0;
}
.contentindexart {
overflow: hidden;
border: none;
margin: 0;
padding: 0;
display: block;
.linkgroup-everywhere ul {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 0 1.5rem;
justify-content: center;
}
.artitem {
padding-top: 25px;
padding-bottom: 25px;
.linkgroup h4 {
color: #101010;
background: linear-gradient(90deg, rgba(255,0,255,1) 0%, rgba(10,10,10,0) 100%);
font-size: 14px;
font-weight: 500;
padding: 2px 4px;
margin-bottom: 4px;
}
.linkgroup ul {
list-style: none;
padding: 0;
}
.linkgroup a {
color: #ffffff;
text-decoration: none;
font-size: 14px;
display: block;
padding: 2px 5px;
}
.linkgroup a:hover {
color: magenta;
}
.things-block {
border: 1px dotted magenta;
background-color: rgba(16, 16, 16, 0.69);
}
.things-block summary {
cursor: pointer;
padding: 4px 4px;
font-size: 14px;
font-weight: 500;
color: #101010;
background: linear-gradient(90deg, rgba(255,0,255,1) 0%, rgba(10,10,10,0) 100%);
list-style: none;
user-select: none;
display: flex;
justify-content: space-between;
align-items: center;
}
.things-block summary::-webkit-details-marker {
display: none;
}
.things-block summary:hover {
background: linear-gradient(90deg, rgba(255,0,255,0.8) 0%, rgba(10,10,10,0) 100%);
}
.things-block summary::after {
content: '▼';
display: inline-block;
margin-right: 6px;
color: white;
transition: transform .2s;
}
.things-block[open] summary::after {
transform: rotate(180deg);
}
.things-block[open] summary {
margin-bottom: 1rem;
}
#game {
display: block;
width: 100%;
border: 1px dotted cyan;
background-color: rgba(16, 16, 16, 0.69);
}
@font-face {
font-family: "FiraSans";
font-display: swap;
src: url("fonts/FiraSans-Regular.otf") format("opentype");
}
@font-face {
font-family: "deltarune";
src: url("fonts/inconreg.ttf") format('truetype');
font-display: swap;
}
@media (max-width: 480px) {
.main {
gap: 1rem;
}
.linksblock {
gap: 1rem;
}
.artitem img {
padding: 0;
height: auto;
width: 69%;
}
.right p {
margin: auto;
font-size: 12px;
}
.footer {
margin-top: 100px;
}
.footer a {
font-size: 11px;
}
.footer p {
font-size: 11px;
height: 100px;
}
}