#!/bin/sh
# ubq323 citrons coral gollark
ubq323="https://ubq323.website"
citrons="https://mondecitronne.com"
coral="https://coral.shoes"
gollark="https://osmarks.net"
heav="https://hpage.osmarks.net/george_landing_page.html"
helloboi="https://www.helloboi.tk"
quintopia="http://esolang.rutteric.com/"
truttle1="http://truttle1.xyz/"
case "$QUERY_STRING" in
"ubq323") PREV="$coral"
NEXT="$citrons" ;;
"citrons") PREV="$ubq323"
NEXT="$gollark" ;;
"gollark") PREV="$citrons"
NEXT="$heav" ;;
"heav") PREV="$gollark"
NEXT="$helloboi" ;;
"helloboi") PREV="$heav"
NEXT="$quintopia" ;;
"quintopia") PREV="$helloboi"
NEXT="$truttle1" ;;
"truttle1") NEXT="$coral"
PREV="$quintopia" ;;
"coral") PREV="$truttle1"
NEXT="$ubq323" ;;
esac
echo "Content-Type: text/html"
echo ""
#cat <<EOF
#<!DOCTYPE html>
#<html>
# <head>
# <base target="_parent">
# </head>
# <body>
# <style>
# * { box-sizing: inherit; }
# body,html {
# overflow: hidden;
# font-family: sans-serif;
# padding:0;
# margin:0;
# box-sizing: border-box;
# }
# main {
# margin:0;
# padding-left: 5px;
# padding-right: 5px;
# height: 50px;
# border: 1px solid black;
# box-shadow: 5px 5px black;
# /*background-color: pink;*/
# display: flex;
# flex-wrap: nowrap;
# justify-content: space-between;
# }
# #george {
# color: cyan;
# text-decoration: underline;
# text-decoration-color: blue;
# text-decoration-thickness: 2px;
# font-style: oblique;
# animation: 2s infinite alternate george;
# }
# @keyframes george {
# from {
# letter-spacing: 1px;
# }
# to {
# letter-spacing: 6px;
# }
# }
# a {
# color: blue;
# }
# </style>
# <main>
# <p><a href="$PREV">< PREV</a></p>
# <p>The <a href="https://george.gh0.pw" id="george">GEORGE</a> is a noble animal.</p>
# <p><a href="$NEXT">NEXT ></a></p>
# </main>
# </body>
#</html>
#EOF
cat <<EOF
<!DOCTYPE html>
<html>
<head>
<base target="_parent">
</head>
<body>
<style>
body,html {
overflow: hidden;
font-family: sans-serif;
padding:0;
margin:0;
}
main {
margin:0;
padding-left: 5px;
padding-right: 5px;
height: 45px;
border: 1px solid black;
box-shadow: 5px 5px black;
/*background-color: pink;*/
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
}
#george {
color: cyan;
text-decoration: underline;
text-decoration-color: blue;
text-decoration-thickness: 2px;
font-style: oblique;
animation: 2s infinite alternate george;
}
#noble {
font-size: min(3vw, 12pt);
}
p {
white-space: nowrap;
align-self: center;
}
@keyframes george {
from {
letter-spacing: 1px;
}
to {
letter-spacing: 6px;
}
}
a {
color: blue;
}
</style>
<main>
<p><a href="$PREV">< PREV</a></p>
<p id="noble">
The <a href="https://george.gh0.pw" id="george">GEORGE</a> is a noble animal.
</p>
<p><a href="$NEXT">NEXT ></a></p>
</main>
</body>
</html>
EOF