9be2f36883
- Removed some unused files - Updated the blog post layout to have all the navigation - Replaced hovertext in blog posts with footnotes - Seaonal pride captions on homepage - Updated /etc/quotes/ - Background color is now actually reminiscent of Discord - Total overhaul to /uses/ - Added sub-page for my computer - New markup for blockquotes that css-tricks.com says is more semantically correct - More difficult captcha on the guestbook (answer remains unchanged) - New blog post about DMs on the fediverse - Blog now has links to each year - Removed journal. I barely used it and it was redundant anyway - Removed the TODO list that I wasn't using from /etc/ - CSS overhaul: - Cool new hover animation on navigation links - Centralized most color definitions to root variables, and a couple other things too - Standard font is now B612 mono - complies with prefers-reduced-motion - Light theme and low contrast mode in the works - Made tables more consistent, and the one on /about/ no longer looks like doodoo - Accent borders on headings and such-like - Main header & caption are now left-aligned instead of center-aligned - Isopod letterhead moved from left side of header to right - h1 made smaller, h2-6 changed back to default sizes - Adjusted a couple background positions to improve readability - Got rid of the checkbox-hack dropdown navigation on mobile, because it kind of sucked - Regular body text no longer has text-shadow - probably some other stuff I forgot about
360 lines
14 KiB
PHP
360 lines
14 KiB
PHP
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<link href="style.css" rel="stylesheet" type="text/css" media="all">
|
||
<style>
|
||
body {
|
||
margin-top: 0;
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
main {
|
||
height: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
main > :is(div, nav) {
|
||
width: 100%;
|
||
}
|
||
|
||
#webrings > div {
|
||
margin: var(--stdpadding);
|
||
}
|
||
#webrings div :is(a, span) {
|
||
padding: initial;
|
||
margin: initial;
|
||
background: none;
|
||
border-left: none;
|
||
}
|
||
|
||
#guys {
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 3rem;
|
||
font-size: 0;
|
||
}
|
||
#guys > * {
|
||
margin-right: var(--stdpadding);
|
||
}
|
||
#bubblecolumn {
|
||
position: absolute;
|
||
right: 7%;
|
||
top: 0;
|
||
width: 29px;
|
||
height: 100%;
|
||
background-image: url(images/bubblecolumn1.gif);
|
||
background-repeat: repeat-y;
|
||
}
|
||
#bucketfish, .bflink {
|
||
--red: #ffcaca;
|
||
--orange: #ffedc1;
|
||
--yellow: #feffb8;
|
||
--green: #c4ffcb;
|
||
--blue: #add8ff;
|
||
--purple: #ccafe9;
|
||
--darkgreen: #3E885B;
|
||
--darkblue: #7fb4f5;
|
||
--background: #454545;
|
||
--rainbowright: linear-gradient(to right, var(--red) 0%, var(--orange) 20%, var(--yellow) 40%, var(--green) 60%, var(--blue) 80%, var(--purple) 100%);
|
||
|
||
color: var(--purple);
|
||
display: inline-block;
|
||
position: relative;
|
||
text-decoration: none;
|
||
transition: linear .2s;
|
||
}
|
||
#bucketfish:before, .bflink:before {
|
||
background: var(--rainbowright);
|
||
content: '';
|
||
height: 2px;
|
||
position: absolute;
|
||
bottom: -1.5px;
|
||
width: 100%;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
transition: width 0.2s ease-in-out;
|
||
}
|
||
.bflink:hover {
|
||
color: var(--purple);
|
||
}
|
||
#bucketfish:hover:before, .bflink:hover:before {
|
||
width: 0;
|
||
}
|
||
#bucketfish span {
|
||
animation-delay: var(--n);
|
||
animation: wave 1.5s linear var(--n) infinite forwards running, rainbow 3s linear var(--n) infinite forwards running;
|
||
position: relative;
|
||
}
|
||
|
||
@media (prefers-reduced-motion) {
|
||
#bubblecolumn {
|
||
display: none;
|
||
}
|
||
#bucketfish span {
|
||
animation: none;
|
||
}
|
||
}
|
||
@media only screen and (hover: none) {
|
||
#rightsidebg {
|
||
box-shadow: none;
|
||
}
|
||
main {
|
||
justify-content: initial;
|
||
height: initial;
|
||
}
|
||
#guys {
|
||
position: initial;
|
||
bottom: initial;
|
||
left: initial;
|
||
}
|
||
body {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
}
|
||
}
|
||
|
||
@keyframes wave{
|
||
0% {top: 0px;}
|
||
25% {top: -1px;}
|
||
50% {top: 0px;}
|
||
75% {top: 1px;}
|
||
100% {top: 0px;}
|
||
}
|
||
|
||
@keyframes rainbow{
|
||
0% {color: var(--red);}
|
||
17% {color: var(--orange);}
|
||
33% {color: var(--yellow);}
|
||
50% {color: var(--green);}
|
||
67% {color: var(--blue);}
|
||
83% {color: var(--purple);}
|
||
100% {color: var(--red);}
|
||
}
|
||
</style>
|
||
<?php
|
||
include($_SERVER['DOCUMENT_ROOT'] . '/seasonal.php');
|
||
if(!preg_match('/(headless.*)/i', $_SERVER['HTTP_USER_AGENT'])) {
|
||
$captions = array();
|
||
$seasonal = false;
|
||
switch(date('m')) {
|
||
case 6:
|
||
$captions = array(
|
||
'your gay',
|
||
'the fuck is a gender',
|
||
'trnasgener',
|
||
'This site uses $_GAY_COOKIE_EQUIVALENT',
|
||
'Supports LGBT!',
|
||
'Banned in Florida!',
|
||
'Are you cis or are you normal'
|
||
);
|
||
$seasonal = true;
|
||
break;
|
||
case 10:
|
||
$captions = array(
|
||
'Boo!',
|
||
'Happy Halloween!',
|
||
'World\'s ' . rand(1, 1000000) . 'th spookiest website',
|
||
'$spooky_captions[array_rand($spooky_captions)]',
|
||
'I thought I\'d be able to come up with more Halloween captions to be honest',
|
||
'It\'s the Spooky Month™!',
|
||
'I vant to suck your blood! Just kidding... Unless...?',
|
||
'This site uses $_HALLOWEEN_THEMED_COOKIE_EQUIVALENT'
|
||
);
|
||
$seasonal = true;
|
||
break;
|
||
case 12:
|
||
$captions = array(
|
||
'hoe hoe hoe or some shit',
|
||
'Happy Holidays!',
|
||
'World\'s ' . rand(1, 1000000) . 'th most festive website',
|
||
'Like half of these captions are just lifted wholesale from the Halloween ones',
|
||
'$festive_captions[array_rand($festive_captions)]',
|
||
'Merry Capitalism!',
|
||
'It\'s winter! Nothing else special about this time of year, no siree!',
|
||
'This site uses $_CHRISTMAS_THEMED_COOKIE_EQUIVALENT... I guess that would just be normal cookies, huh?',
|
||
'Pretend I put Mariah Carey on autoplay here'
|
||
);
|
||
$seasonal = true;
|
||
break;
|
||
default:
|
||
$captions = array(
|
||
'bruh moment',
|
||
'Try reloading!',
|
||
'Supports VPNs',
|
||
'I use arch btw',
|
||
'Stream deep twisty',
|
||
'MySite.html',
|
||
'Over Construction',
|
||
'Real isopod hours',
|
||
'Version 3.1: The Accent Borders Update',
|
||
'Version 3.1: The Tables Don\'t Look Like Shit Anymore Update',
|
||
'depytwisty',
|
||
'[object Object]',
|
||
'* You found the [Moss]!',
|
||
'Minceraft',
|
||
'Best viewed with Firefox',
|
||
'Isopod gaming',
|
||
'Website of some "guy"',
|
||
'your mom',
|
||
'Badly programmed',
|
||
'Fuck crypto',
|
||
'Oh, you know ;)',
|
||
'gamer (terminal)',
|
||
'This is not a place of honor',
|
||
'I can type interrobangs, watch‽',
|
||
'ඞ',
|
||
'127.0.0.1',
|
||
'assholes DNI',
|
||
'swag',
|
||
'\'\'',
|
||
'$captions[array_rand($captions)]',
|
||
'NFT bros don\'t FUCKING interact',
|
||
'Kind of dragon free!',
|
||
'This site uses cookies (chocolate chip)',
|
||
'Now with reduced centralization!',
|
||
'your gay',
|
||
'the fuck is a gender',
|
||
'The Only Website',
|
||
'𝓘𝓷𝓪𝓬𝓬𝓮𝓼𝓼𝓲𝓫𝓵𝓮!',
|
||
'Follow me on Google+!',
|
||
'404: caption not found',
|
||
'Web π compliant!',
|
||
'If you\'re seeing this, something is seriously wrong.',
|
||
'cringe',
|
||
'don\'t smoke cigarettes kids they\'ll make your lungs sus',
|
||
'real life isopod',
|
||
'holy fucking bingle',
|
||
'AI (Aquatic Isopod) generated',
|
||
'crubge',
|
||
'Only unpickle data you trust.',
|
||
'Tested in prod!',
|
||
'pwetty epic B)',
|
||
'Known to the state of California to cause cancer',
|
||
'Semi-modular!',
|
||
'Did you know?',
|
||
'shrimps is bugs',
|
||
'Delicious!',
|
||
'trnasgener',
|
||
'Opinionated!',
|
||
'Eurorack compatible!',
|
||
'Hackable!',
|
||
'HiDPI!',
|
||
'COUNTER',
|
||
'TUEADAY',
|
||
'PLACEHIM',
|
||
'UPSIDEDOWN',
|
||
'RGB',
|
||
'BLAHAJ',
|
||
'@BEAT',
|
||
'HALO'
|
||
);
|
||
break;
|
||
}
|
||
$cap = $captions[array_rand($captions)];
|
||
if($_GET['caption']) {
|
||
$cap = $_GET['caption'];
|
||
}
|
||
$tit = $cap;
|
||
if(!$seasonal) {
|
||
switch($cap) {
|
||
case 'COUNTER':
|
||
$num = (int) filter_var(file_get_contents("views.txt"), FILTER_SANITIZE_NUMBER_INT);
|
||
$num++;
|
||
file_put_contents("views.txt", $num);
|
||
$cap = "This caption has been viewed $num times!";
|
||
$tit = "This title has been viewed $num times!";
|
||
break;
|
||
case 'TUEADAY':
|
||
$day = array("suday", "moday", "tueaday", "weaday", "thuday", "friaday", "satuaday")[date('w')];
|
||
$cap = "wait it's fucking $day. god.";
|
||
$tit = $cap;
|
||
echo "<style type='text/css'>h1{background-image:url('old/1/images/$day.png');}</style>";
|
||
break;
|
||
case 'PLACEHIM':
|
||
$cap = 'place him on your site immediately';
|
||
$tit = $cap;
|
||
echo "<style type='text/css'>h1{background-image:url('images/place_him.png');}</style>";
|
||
break;
|
||
case 'BLAHAJ':
|
||
$cap = '<img id="blahaj" src="images/blahaj.png"> <a href="https://berrymot.github.io/">certified</a> Good Website by blåhaj';
|
||
$tit = "certified Good Website by blåhaj";
|
||
echo "<style type='text/css'>#blahaj { animation: spin 5s linear infinite; height: 1em; } @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @media (prefers-reduced-motion) { #blahaj { animation: none; } }</style>";
|
||
break;
|
||
case 'Kind of dragon free!':
|
||
$cap = '<span class="minecraftsplash">Kind of dragon free!</span>';
|
||
break;
|
||
case 'UPSIDEDOWN':
|
||
$cap = '<span class="flipped">Upside Down!</span>';
|
||
$tit = '¡uʍop ǝpısdn';
|
||
break;
|
||
case 'RGB':
|
||
$cap = '<span class="rainbowtext">RGB Gaming Webpage</span>';
|
||
$tit = 'RGB Gaming Webpage';
|
||
break;
|
||
case '@BEAT':
|
||
$cap = '<a href="/stuff/beat/">@'.date("B").'</a>';
|
||
$tit = '@'.date("B");
|
||
break;
|
||
case 'HALO':
|
||
$cap = '<a href="https://www.youtube.com/watch?v=N14uA0EhBAU">coke and fries halo</a>';
|
||
$tit = 'coke and fries halo';
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
?>
|
||
<title><?php if($tit) { echo "isopod.cool v3 - $tit"; } else { echo "isopod.cool v3"; } ?></title>
|
||
<meta name="description" content="real life isopod">
|
||
</head>
|
||
<body>
|
||
<?php include('nav.php'); ?>
|
||
<main>
|
||
<div>
|
||
<h1 style="margin-top: 0;">isopod dot cool<sup>v3.1</sup></h1>
|
||
<h2 id="caption"><?php echo $cap; ?></h2>
|
||
</div>
|
||
<nav id="webrings">
|
||
<div style="font-family: sans-serif; font-weight: bold;">
|
||
<a href="https://hotlinewebring.club/bathynomus/previous" style="color: white; text-decoration: none;">←</a>
|
||
<a href="https://hotlinewebring.club/" style="color: white; text-decoration: none; font-style: italic;">HOTLINE WEBRING</a>
|
||
<a href="https://hotlinewebring.club/bathynomus/next" style="color: white; text-decoration: none;">→</a>
|
||
</div>
|
||
<div>
|
||
<a href="https://melonland.net/surf-club.html" style="color: #ff74ff;"><span style="color: #e7ad59;">melon</span><span style="color: #c0ea32;">ring</span></a>
|
||
<a href="https://brain.melonking.net/surf-club-random" style="color: #ff74ff;"><span style="color: #864cff;">?</span></a>
|
||
</div>
|
||
<div>
|
||
<a href="https://webring.bucketfish.me/redirect.html?to=prev&name=isopod" class="bflink">⥼</a>
|
||
<a href="https://webring.bucketfish.me" id="bucketfish"><span style="--n:-10000ms;">b</span><span style="--n:-9900ms;">u</span><span style="--n:-9800ms;">c</span><span style="--n:-9700ms;">k</span><span style="--n:-9600ms;">e</span><span style="--n:-9500ms;">t</span><span style="--n:-9400ms;"> </span><span style="--n:-9300ms;">w</span><span style="--n:-9200ms;">e</span><span style="--n:-9100ms;">b</span><span style="--n:-9000ms;">r</span><span style="--n:-8900ms;">i</span><span style="--n:-8800ms;">n</span><span style="--n:-8700ms;">g</span></a>
|
||
<a href="https://webring.bucketfish.me/redirect.html?to=next&name=isopod" class="bflink">⥽</a>
|
||
</div>
|
||
</nav>
|
||
<!--script type="text/javascript">document.write('<a href="desktop.html">$login<span class="blinking" >_</span></a>');</script-->
|
||
</main>
|
||
|
||
<div id="guys">
|
||
<a target="_blank" href="https://dokodemo.neocities.org/" title="made by Dokodemo"><img alt="An isopod!" src="images/isopod3.png"></a>
|
||
<a target="_blank" href="https://lu.tiny-universes.net" title="hi, i'm kevin!"><img alt="Kevin" src="images/plant1-2.png"></a>
|
||
<a target="_blank" href="https://newlambda.neocities.org/stuff/adopt" title="benlet"><img alt="benlet" src="images/benlet1.png" style="width: 32px; image-rendering: pixelated;"></a>
|
||
<a target="_blank" href="https://www.pixelcatsend.com/profile&id=3734" title="Shadow"><img alt="Shadow" src="images/shadow.png" style="image-rendering: pixelated;"></a>
|
||
<a target="_blank" href="https://tarraxahum.neocities.org/adopt/adopt_center" title="french fry"><img alt="french fry" src="images/fry.png" style="height: 2rem;"></a>
|
||
<a target="_blank" href="https://kelpeater.neocities.org/collections/isopods" title="Another isopod!"><img alt="Another isopod!" src="images/casiopea_isopod.png" style="height: 4rem;"></a>
|
||
<a target="_blank" href="https://shroom.ink/decay/adopt-a-shroom/" title="Ophiocordyceps Unilateralis"><img alt="Ophiocordyceps Unilateralis" src="images/Ophiocordyceps_unilateralis.png" style="height: 4rem;"></a>
|
||
</div>
|
||
<div id="rightsidebg" style="background-image: url(images/bg.jxl), url(images/bg.jpg); --distancefromcenter: 11%;" title="Pictured: The eponymous "deep twisty""></div>
|
||
<div id="bubblecolumn"></div>
|
||
<?php
|
||
if(date("w") == "5" && rand(0, 9) == 4) {
|
||
$ind = rand(1,2);
|
||
$filename = "images/flatworm friday $ind.mp4";
|
||
echo "<div id='flatwormfriday' style='position: absolute;left: 0;right: 0;top: 0;bottom: 0;background: #000000cc;display: flex;justify-content: center;align-items: center;'><video controls=''><source src='$filename' type='video/mp4'>It's Flatworm Friday! Your browser does not support the video tag.</video><span style='position: absolute; left: 1rem; bottom: 1rem;'>Refresh the page to close this</span></div>";
|
||
}
|
||
?>
|
||
</body>
|
||
</html>
|