css tweaks
This commit is contained in:
parent
56d0dd80af
commit
c0f0ba03da
17 changed files with 1197 additions and 1174 deletions
2
.gitignore
vendored
2
.gitignore
vendored
|
|
@ -1 +1 @@
|
|||
site
|
||||
site
|
||||
|
|
|
|||
56
Makefile
56
Makefile
|
|
@ -1,28 +1,28 @@
|
|||
all: static site/index-2.html
|
||||
|
||||
.PHONY: clean site static
|
||||
|
||||
clean:
|
||||
rm -r site
|
||||
|
||||
site:
|
||||
mkdir -p site
|
||||
|
||||
static: site
|
||||
cp -r static/* site
|
||||
|
||||
site/xkcd.css: src/xkcd-rgb.txt src/xkcd-css.py
|
||||
src/xkcd-css.py > site/xkcd.css
|
||||
|
||||
site/style.css: site/xkcd.css src/style.css
|
||||
cp src/style.css site/style.css
|
||||
|
||||
site/index-2.html: site/style.css src/index.md src/nav.html
|
||||
pandoc src/index.md \
|
||||
--standalone \
|
||||
--section-divs \
|
||||
--css style.css \
|
||||
--no-highlight \
|
||||
--include-before-body src/nav.html \
|
||||
--from markdown+emoji \
|
||||
-o site/index-2.html
|
||||
all: static site/index-2.html
|
||||
|
||||
.PHONY: clean site static
|
||||
|
||||
clean:
|
||||
rm -r site
|
||||
|
||||
site:
|
||||
mkdir -p site
|
||||
|
||||
static: site
|
||||
cp -r static/* site
|
||||
|
||||
site/xkcd.css: src/xkcd-rgb.txt src/xkcd-css.py
|
||||
src/xkcd-css.py > site/xkcd.css
|
||||
|
||||
site/style.css: site/xkcd.css src/style.css
|
||||
cp src/style.css site/style.css
|
||||
|
||||
site/index-2.html: site/style.css src/index.md src/nav.html
|
||||
pandoc src/index.md \
|
||||
--standalone \
|
||||
--section-divs \
|
||||
--css style.css \
|
||||
--no-highlight \
|
||||
--include-before-body src/nav.html \
|
||||
--from markdown+emoji \
|
||||
-o site/index-2.html
|
||||
|
|
|
|||
|
|
@ -1,2 +1,2 @@
|
|||
# nupa.me
|
||||
My Homepage!
|
||||
# nupa.me
|
||||
My Homepage!
|
||||
|
|
|
|||
42
src/index.md
42
src/index.md
|
|
@ -1,7 +1,35 @@
|
|||
---
|
||||
title: nycki.net
|
||||
...
|
||||
|
||||
## Hello World
|
||||
|
||||
lorem ipsum dolor sit amet.
|
||||
---
|
||||
title: nycki.net
|
||||
...
|
||||
|
||||
## welcome!
|
||||
|
||||
my name is Nycki ([ˈnɪki](http://ipa-reader.xyz/?text=%CB%88n%C9%AAki)), and [this is a website!](http://hrwiki.org/wiki/First_Time_Here%3F)
|
||||
|
||||
## capitalization?
|
||||
|
||||
yep, I'm doing the 'intentionally lowercase' thing. I like to reserve capital letters for names. more thoughts on this in my [cookbook](https://klay.gay/self-host).
|
||||
|
||||
## contact
|
||||
|
||||
some of these will change as I transition from my old internet name 'nupa' to my new one 'nycki'. it's just personal preference, I'll still answer to either name for the time being. oh yeah my pronouns are she/they now, thanks!
|
||||
|
||||
- nupanick at google mail
|
||||
- <https://github.com/nycki93>
|
||||
- <https://cohost.org/nycki>
|
||||
- <https://www.reddit.com/user/nupanick>
|
||||
- <https://twitter.com/nupanick>
|
||||
|
||||
## creations
|
||||
|
||||
stuff I've made!
|
||||
|
||||
### braceless javascript
|
||||
2018\. a couple of short programs written in browser JavaScript, with the special restriction that I can't use any instructions that require curly braces, like 'if' or 'for'. instead, I replace these instructions with ternaries and lambdas, which makes this a functional programming exercise!
|
||||
|
||||
- [fizzbuzz](https://github.com/nycki93/braceless-javascript/blob/master/fizzbuzz.html)
|
||||
- [99 bottles](https://github.com/nycki93/braceless-javascript/blob/master/bottles.html)
|
||||
|
||||
## todo
|
||||
|
||||
- fill out the 'creations' section a bit more before publishing this
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
<nav>
|
||||
<a href="/">home</a>
|
||||
</nav>
|
||||
<nav>
|
||||
<a href="/">home</a>
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -1,49 +1,44 @@
|
|||
@import 'xkcd-rgb.css';
|
||||
|
||||
:root {
|
||||
font-family: sans-serif;
|
||||
color: var(--xkcd-pale-magenta);
|
||||
padding: 2rem;
|
||||
background-color: black;
|
||||
max-width: 100ch;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div.subtitle {
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--xkcd-magenta);
|
||||
}
|
||||
|
||||
section {
|
||||
margin-top: 2ch;
|
||||
border-top: 1.5ch double;
|
||||
}
|
||||
|
||||
section img {
|
||||
display: block;
|
||||
border: 1.5ch double;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-height: 40ch;
|
||||
}
|
||||
|
||||
.gallery {
|
||||
display:flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.gallery img {
|
||||
border: 0.5ch solid;
|
||||
margin: 1ch;
|
||||
width: 12ch;
|
||||
@import 'xkcd.css';
|
||||
|
||||
:root {
|
||||
--background: black;
|
||||
--foreground: var(--xkcd-light-grey);
|
||||
--link: var(--xkcd-steel-blue);
|
||||
|
||||
font-family: sans-serif;
|
||||
background-color: var(--background);
|
||||
color: var(--foreground);
|
||||
max-width: 100ch;
|
||||
margin: auto;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--link);
|
||||
}
|
||||
|
||||
section.level2 {
|
||||
margin-top: 2ch;
|
||||
border-top: 1.5ch double var(--xkcd-magenta);
|
||||
}
|
||||
|
||||
section img {
|
||||
display: block;
|
||||
border: 1.5ch double;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-height: 40ch;
|
||||
}
|
||||
|
||||
.gallery {
|
||||
display:flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.gallery img {
|
||||
border: 0.5ch solid;
|
||||
margin: 1ch;
|
||||
width: 12ch;
|
||||
}
|
||||
|
|
@ -1,23 +1,23 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>Traps and Zoids</title>
|
||||
</head>
|
||||
|
||||
<body bgcolor=#36c1fc>
|
||||
|
||||
<h1><center>Cartoons!</center></h1>
|
||||
<br><b>Traps and Zoids</b>
|
||||
<br><a href="trapzoid01.html">1-Supply and demand</a>
|
||||
<br><a href="trapzoid02.html">2-Metajoke</a>
|
||||
<br><a href="trapzoid03.html">3-A Trail of Pens</a>
|
||||
<br><hr color="orange">
|
||||
<br>More to come...
|
||||
<br>eventually...
|
||||
|
||||
<!--, check back in a couple weeks or so!-->
|
||||
|
||||
<br><a href="index.html"><font color="red" size="4">Back</font></a>
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>Traps and Zoids</title>
|
||||
</head>
|
||||
|
||||
<body bgcolor=#36c1fc>
|
||||
|
||||
<h1><center>Cartoons!</center></h1>
|
||||
<br><b>Traps and Zoids</b>
|
||||
<br><a href="trapzoid01.html">1-Supply and demand</a>
|
||||
<br><a href="trapzoid02.html">2-Metajoke</a>
|
||||
<br><a href="trapzoid03.html">3-A Trail of Pens</a>
|
||||
<br><hr color="orange">
|
||||
<br>More to come...
|
||||
<br>eventually...
|
||||
|
||||
<!--, check back in a couple weeks or so!-->
|
||||
|
||||
<br><a href="index.html"><font color="red" size="4">Back</font></a>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,41 +1,41 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>Nick.lamicela.org</title>
|
||||
</head>
|
||||
<body bgcolor=#36c1fc>
|
||||
|
||||
<center><h4><font color="red">
|
||||
Welcome to Nick.Lamicela.Org!
|
||||
</font></h></center>
|
||||
|
||||
<center><table><tr><td><center>
|
||||
|
||||
<!-- News Page Image -->
|
||||
<img src="Images/NewsCompass.gif" width="300" height="297" alt="News" border="0">
|
||||
|
||||
</center></td><td><center>
|
||||
|
||||
<!-- Cartoons page image -->
|
||||
<img src="Images/Gami.gif" width="280" height="235" alt="" border="0">
|
||||
|
||||
</center></td></tr><tr><td><center>
|
||||
|
||||
<!-- News Page Link -->
|
||||
<br><a href="news.html"><font color="green" size="6">News</font></a>
|
||||
|
||||
</center></td><td><center>
|
||||
|
||||
<!-- Cartoons Page Link -->
|
||||
<br><a href="cartoons.html"><font color="green" size="6">Cartoons</font></a>
|
||||
|
||||
</center></td></tr></table><br>
|
||||
|
||||
<!-- Last Updated Date -->
|
||||
<center><table><tr><td bgcolor="black"><font face="fixedsys, courier new, courier" size="5" color="green">
|
||||
Last updated: 08/01/07
|
||||
</font></td></tr></table></center>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>Nick.lamicela.org</title>
|
||||
</head>
|
||||
<body bgcolor=#36c1fc>
|
||||
|
||||
<center><h4><font color="red">
|
||||
Welcome to Nick.Lamicela.Org!
|
||||
</font></h></center>
|
||||
|
||||
<center><table><tr><td><center>
|
||||
|
||||
<!-- News Page Image -->
|
||||
<img src="Images/NewsCompass.gif" width="300" height="297" alt="News" border="0">
|
||||
|
||||
</center></td><td><center>
|
||||
|
||||
<!-- Cartoons page image -->
|
||||
<img src="Images/Gami.gif" width="280" height="235" alt="" border="0">
|
||||
|
||||
</center></td></tr><tr><td><center>
|
||||
|
||||
<!-- News Page Link -->
|
||||
<br><a href="news.html"><font color="green" size="6">News</font></a>
|
||||
|
||||
</center></td><td><center>
|
||||
|
||||
<!-- Cartoons Page Link -->
|
||||
<br><a href="cartoons.html"><font color="green" size="6">Cartoons</font></a>
|
||||
|
||||
</center></td></tr></table><br>
|
||||
|
||||
<!-- Last Updated Date -->
|
||||
<center><table><tr><td bgcolor="black"><font face="fixedsys, courier new, courier" size="5" color="green">
|
||||
Last updated: 08/01/07
|
||||
</font></td></tr></table></center>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>What's up?</title>
|
||||
</head
|
||||
|
||||
<body bgcolor=#36c1fc>
|
||||
|
||||
<font color="red"><i>08/01/2007:</i></font> I guess what's new today is that I ummm, have a news page? I had an idea for the logo in the middle of the night last night and I got out of bed, drew the compass thingy, inked it, and went back to bed. This morning I colored it in photoshop and added it to my website, along with this news page. If I ever update again, You'll know about it here.
|
||||
|
||||
</body>
|
||||
<html>
|
||||
<head>
|
||||
<title>What's up?</title>
|
||||
</head
|
||||
|
||||
<body bgcolor=#36c1fc>
|
||||
|
||||
<font color="red"><i>08/01/2007:</i></font> I guess what's new today is that I ummm, have a news page? I had an idea for the logo in the middle of the night last night and I got out of bed, drew the compass thingy, inked it, and went back to bed. This morning I colored it in photoshop and added it to my website, along with this news page. If I ever update again, You'll know about it here.
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,16 +1,16 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>01-Supply and Demand</title>
|
||||
</head>
|
||||
|
||||
<body bgcolor=#36c1fc>
|
||||
<center>
|
||||
<h5>Episode 1-supply and demand.</h>
|
||||
<br><img src="Images/Traps_and_zoids01.gif" width="600" height="200" alt="" border="0">
|
||||
<br><a href="cartoons.html">back</a>
|
||||
</center>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>01-Supply and Demand</title>
|
||||
</head>
|
||||
|
||||
<body bgcolor=#36c1fc>
|
||||
<center>
|
||||
<h5>Episode 1-supply and demand.</h>
|
||||
<br><img src="Images/Traps_and_zoids01.gif" width="600" height="200" alt="" border="0">
|
||||
<br><a href="cartoons.html">back</a>
|
||||
</center>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,16 +1,16 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>02-Metajoke</title>
|
||||
</head>
|
||||
|
||||
<body bgcolor=#36c1fc>
|
||||
<center>
|
||||
<h5>Episode 2-Metajoke</h>
|
||||
<br><img src="Images/Traps_and_zoids02.gif">
|
||||
<br><a href="cartoons.html">back</a>
|
||||
</center>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>02-Metajoke</title>
|
||||
</head>
|
||||
|
||||
<body bgcolor=#36c1fc>
|
||||
<center>
|
||||
<h5>Episode 2-Metajoke</h>
|
||||
<br><img src="Images/Traps_and_zoids02.gif">
|
||||
<br><a href="cartoons.html">back</a>
|
||||
</center>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,16 +1,16 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>03-A Trail of Pens...</title>
|
||||
</head>
|
||||
|
||||
<body bgcolor=#36c1fc>
|
||||
<center>
|
||||
<h5>Episode 3-A Trail of Pens</h>
|
||||
<br><img src="Images/Traps_and_zoids03.gif">
|
||||
<br><a href="cartoons.html">back</a>
|
||||
</center>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>03-A Trail of Pens...</title>
|
||||
</head>
|
||||
|
||||
<body bgcolor=#36c1fc>
|
||||
<center>
|
||||
<h5>Episode 3-A Trail of Pens</h>
|
||||
<br><img src="Images/Traps_and_zoids03.gif">
|
||||
<br><a href="cartoons.html">back</a>
|
||||
</center>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,37 +1,37 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Image Gallery Test</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
|
||||
<header>
|
||||
<h1>Gallery Example</h1>
|
||||
<div class="subtitle">For all your thumbnail gallery needs!</div>
|
||||
</header>
|
||||
|
||||
<section class="gallery">
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
</body>
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Image Gallery Test</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
|
||||
<header>
|
||||
<h1>Gallery Example</h1>
|
||||
<div class="subtitle">For all your thumbnail gallery needs!</div>
|
||||
</header>
|
||||
|
||||
<section class="gallery">
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
<a href="images/collabyrinth-title.png"><img src="images/collabyrinth-title.png"></a>
|
||||
<a href="images/traps-and-zoids_home.png"><img src="images/traps-and-zoids_home.png"></a>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,93 +1,93 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Nycki's Page</title>
|
||||
<meta charset='utf-8'/>
|
||||
<link rel='stylesheet' href='style.css'>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<header>
|
||||
<h1>Nycki's Page</h1>
|
||||
<div class='subtitle'>A place to show off my projects.</div>
|
||||
</header>
|
||||
|
||||
<section>
|
||||
<h2>Braceless Javascript</h2>
|
||||
<p>
|
||||
2018. A couple of short programs written in a subset of javascript. Specifically, javascript but you can't use anything with curly braces in it, like 'if' or 'for'. Instead, ternaries and lambdas give you all the flow control you need. Has a lispy flavor.
|
||||
</p>
|
||||
<p>
|
||||
<a href='https://nycki93.github.io/braceless-javascript/fizzbuzz.html'>FizzBuzz</a> (<a href='https://github.com/nycki93/braceless-javascript/blob/master/fizzbuzz.html'>Source</a>),
|
||||
<a href='https://nycki93.github.io/braceless-javascript/bottles.html'>Bottles</a> (<a href='https://github.com/nycki93/braceless-javascript/blob/master/bottles.html'>Source</a>).
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>Flistify</h2>
|
||||
<p>
|
||||
2018. A script to bulk-resize images for an f-list gallery, using windows batch and imagemagick.
|
||||
</p>
|
||||
<p>
|
||||
<a href='https://github.com/nycki93/flistify'>Flistify source on GitHub.</a>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>Portal ZZT</h2>
|
||||
<p>
|
||||
2008. A portal clone in the ZZT Engine. Available at the Museum of ZZT.
|
||||
</p>
|
||||
<p>
|
||||
<a href='https://museumofzzt.com/file/p/PortalZZT_v0_5.zip'>PortalZZT in the Museum of ZZT.</a>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>ZZT Nanogames</h2>
|
||||
<p>
|
||||
2008. A collection of ZZT games that use only one screen each. Also includes <em>Eight Legged Express</em>, which I believe was made in one weekend as a challenge.
|
||||
</p>
|
||||
<p>
|
||||
<a href='https://museumofzzt.com/file/n/nanopack01.zip'>ZZT Nanogames in the Museum of ZZT.</a>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>Collabyrinth</h2>
|
||||
<img src='images/collabyrinth-title.png' alt='The title screen for the game Collabyrinth. The twelve letters of the word "COLLABYRINTH" are arranged in a 3 by 4 grid. Most of them are just an ordinary letter, but the O, L, L, Y, and R have been decorated in a variety of mismatched styles.'/>
|
||||
<p>
|
||||
2008. A collaborative labyrinth ZZT game. I organized this on the z2 forums.
|
||||
</p>
|
||||
<p>
|
||||
Credits:
|
||||
</p>
|
||||
<ul>
|
||||
<li>Alexis Janson</li>
|
||||
<li>Commodore</li>
|
||||
<li>Infosponge</li>
|
||||
<li>Jur</li>
|
||||
<li>Nupanick (me!)</li>
|
||||
<li>Oof, aka Superbowl Shuffle</li>
|
||||
<li>Quantum P</li>
|
||||
<li>RobertP</li>
|
||||
</ul>
|
||||
<p>
|
||||
<a href='https://museumofzzt.com/file/c/clbrnth1.zip'>Collabyrinth in the Museum of ZZT.</a>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>Traps and Zoids</h2>
|
||||
<img src='images/traps-and-zoids_home.png' alt='A screenshot of an old website. Red text on a light blue background says "Welcome to Nick.Lamicela.Org!". There is a compass rose at an angle, so that the letters read "NEWS" from top to bottom, and a link underneath says "News". There is a black and white cartoon face that looks like a folded boat or paper airplane, and a link underneath that says "Cartoons". At the bottom of the page is the text "Last Updated: 08/01/07.'>
|
||||
<p>
|
||||
2007. Some hand-drawn cartoons and very old web design. Good old HTML 4.0 Transitional.
|
||||
</p>
|
||||
<p>
|
||||
<a href='2007'>My archive copy.</a>
|
||||
<a href='https://web.archive.org/web/20071101001849/http://nick.lamicela.org/'>Archive.org's copy.</a>
|
||||
</p>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Nycki's Page</title>
|
||||
<meta charset='utf-8'/>
|
||||
<link rel='stylesheet' href='style.css'>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<header>
|
||||
<h1>Nycki's Page</h1>
|
||||
<div class='subtitle'>A place to show off my projects.</div>
|
||||
</header>
|
||||
|
||||
<section class='level2'>
|
||||
<h2>Braceless Javascript</h2>
|
||||
<p>
|
||||
2018. A couple of short programs written in a subset of javascript. Specifically, javascript but you can't use anything with curly braces in it, like 'if' or 'for'. Instead, ternaries and lambdas give you all the flow control you need. Has a lispy flavor.
|
||||
</p>
|
||||
<p>
|
||||
<a href='https://nycki93.github.io/braceless-javascript/fizzbuzz.html'>FizzBuzz</a> (<a href='https://github.com/nycki93/braceless-javascript/blob/master/fizzbuzz.html'>Source</a>),
|
||||
<a href='https://nycki93.github.io/braceless-javascript/bottles.html'>Bottles</a> (<a href='https://github.com/nycki93/braceless-javascript/blob/master/bottles.html'>Source</a>).
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section class='level2'>
|
||||
<h2>Flistify</h2>
|
||||
<p>
|
||||
2018. A script to bulk-resize images for an f-list gallery, using windows batch and imagemagick.
|
||||
</p>
|
||||
<p>
|
||||
<a href='https://github.com/nycki93/flistify'>Flistify source on GitHub.</a>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section class='level2'>
|
||||
<h2>Portal ZZT</h2>
|
||||
<p>
|
||||
2008. A portal clone in the ZZT Engine. Available at the Museum of ZZT.
|
||||
</p>
|
||||
<p>
|
||||
<a href='https://museumofzzt.com/file/p/PortalZZT_v0_5.zip'>PortalZZT in the Museum of ZZT.</a>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section class='level2'>
|
||||
<h2>ZZT Nanogames</h2>
|
||||
<p>
|
||||
2008. A collection of ZZT games that use only one screen each. Also includes <em>Eight Legged Express</em>, which I believe was made in one weekend as a challenge.
|
||||
</p>
|
||||
<p>
|
||||
<a href='https://museumofzzt.com/file/n/nanopack01.zip'>ZZT Nanogames in the Museum of ZZT.</a>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section class='level2'>
|
||||
<h2>Collabyrinth</h2>
|
||||
<img src='images/collabyrinth-title.png' alt='The title screen for the game Collabyrinth. The twelve letters of the word "COLLABYRINTH" are arranged in a 3 by 4 grid. Most of them are just an ordinary letter, but the O, L, L, Y, and R have been decorated in a variety of mismatched styles.'/>
|
||||
<p>
|
||||
2008. A collaborative labyrinth ZZT game. I organized this on the z2 forums.
|
||||
</p>
|
||||
<p>
|
||||
Credits:
|
||||
</p>
|
||||
<ul>
|
||||
<li>Alexis Janson</li>
|
||||
<li>Commodore</li>
|
||||
<li>Infosponge</li>
|
||||
<li>Jur</li>
|
||||
<li>Nupanick (me!)</li>
|
||||
<li>Oof, aka Superbowl Shuffle</li>
|
||||
<li>Quantum P</li>
|
||||
<li>RobertP</li>
|
||||
</ul>
|
||||
<p>
|
||||
<a href='https://museumofzzt.com/file/c/clbrnth1.zip'>Collabyrinth in the Museum of ZZT.</a>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section class='level2'>
|
||||
<h2>Traps and Zoids</h2>
|
||||
<img src='images/traps-and-zoids_home.png' alt='A screenshot of an old website. Red text on a light blue background says "Welcome to Nick.Lamicela.Org!". There is a compass rose at an angle, so that the letters read "NEWS" from top to bottom, and a link underneath says "News". There is a black and white cartoon face that looks like a folded boat or paper airplane, and a link underneath that says "Cartoons". At the bottom of the page is the text "Last Updated: 08/01/07.'>
|
||||
<p>
|
||||
2007. Some hand-drawn cartoons and very old web design. Good old HTML 4.0 Transitional.
|
||||
</p>
|
||||
<p>
|
||||
<a href='2007'>My archive copy.</a>
|
||||
<a href='https://web.archive.org/web/20071101001849/http://nick.lamicela.org/'>Archive.org's copy.</a>
|
||||
</p>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,117 +1,117 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body {
|
||||
font-size: 30px;
|
||||
font-family: Calibri, sans-serif;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
border: #000 solid 10px;
|
||||
width: 500px;
|
||||
height: 700px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
table {
|
||||
margin: 0px auto;
|
||||
}
|
||||
td:first-of-type {
|
||||
text-align: left;
|
||||
min-width: 16ch;
|
||||
}
|
||||
td:not(:first-of-type) {
|
||||
min-width: 2ch;
|
||||
}
|
||||
.border {
|
||||
color: white;
|
||||
background-color: white;
|
||||
text-shadow:
|
||||
-1px -1px 0 #000,
|
||||
1px -1px 0 #000,
|
||||
-1px 1px 0 #000,
|
||||
1px 1px 0 #000;
|
||||
}
|
||||
footer {
|
||||
font-size: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<br> <!-- Look, vertical alignment is hard ok -->
|
||||
<table>
|
||||
<th colspan="6">Poker Hands</th>
|
||||
<tr>
|
||||
<td>Straight Flush</td>
|
||||
<td class="border">A</td>
|
||||
<td class="border">2</td>
|
||||
<td class="border">3</td>
|
||||
<td class="border">4</td>
|
||||
<td class="border">5</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Four of a Kind</td>
|
||||
<td>Q</td>
|
||||
<td>Q</td>
|
||||
<td>Q</td>
|
||||
<td>Q</td>
|
||||
<td>8</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Full House</td>
|
||||
<td>3</td>
|
||||
<td>3</td>
|
||||
<td>3</td>
|
||||
<td>2</td>
|
||||
<td>2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Flush</td>
|
||||
<td class="border">♥</td>
|
||||
<td class="border">♥</td>
|
||||
<td class="border">♥</td>
|
||||
<td class="border">♥</td>
|
||||
<td class="border">♥</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Straight</td>
|
||||
<td>10</td>
|
||||
<td>J</td>
|
||||
<td>Q</td>
|
||||
<td>K</td>
|
||||
<td>A</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Three of a Kind</td>
|
||||
<td>K</td>
|
||||
<td>K</td>
|
||||
<td>K</td>
|
||||
<td>8</td>
|
||||
<td>A</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Two Pairs</td>
|
||||
<td>A</td>
|
||||
<td>A</td>
|
||||
<td>7</td>
|
||||
<td>7</td>
|
||||
<td>5</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>One Pair</td>
|
||||
<td>Q</td>
|
||||
<td>Q</td>
|
||||
<td>4</td>
|
||||
<td>6</td>
|
||||
<td>9</td>
|
||||
</tr>
|
||||
</table>
|
||||
<p>
|
||||
Ties broken by highest card.
|
||||
<br> Matched sets have priority.
|
||||
<br> Aces are high, except in A2345.
|
||||
</p>
|
||||
<p>
|
||||
<span class=border>99</span>542 >
|
||||
<span class=border>88</span>A6<span class="border">4</span> >
|
||||
88A6<span class="border">3</span>
|
||||
</p>
|
||||
<footer>©Nick 'nupa' Lamicela, 2023</footer>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
body {
|
||||
font-size: 30px;
|
||||
font-family: Calibri, sans-serif;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
border: #000 solid 10px;
|
||||
width: 500px;
|
||||
height: 700px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
table {
|
||||
margin: 0px auto;
|
||||
}
|
||||
td:first-of-type {
|
||||
text-align: left;
|
||||
min-width: 16ch;
|
||||
}
|
||||
td:not(:first-of-type) {
|
||||
min-width: 2ch;
|
||||
}
|
||||
.border {
|
||||
color: white;
|
||||
background-color: white;
|
||||
text-shadow:
|
||||
-1px -1px 0 #000,
|
||||
1px -1px 0 #000,
|
||||
-1px 1px 0 #000,
|
||||
1px 1px 0 #000;
|
||||
}
|
||||
footer {
|
||||
font-size: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<br> <!-- Look, vertical alignment is hard ok -->
|
||||
<table>
|
||||
<th colspan="6">Poker Hands</th>
|
||||
<tr>
|
||||
<td>Straight Flush</td>
|
||||
<td class="border">A</td>
|
||||
<td class="border">2</td>
|
||||
<td class="border">3</td>
|
||||
<td class="border">4</td>
|
||||
<td class="border">5</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Four of a Kind</td>
|
||||
<td>Q</td>
|
||||
<td>Q</td>
|
||||
<td>Q</td>
|
||||
<td>Q</td>
|
||||
<td>8</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Full House</td>
|
||||
<td>3</td>
|
||||
<td>3</td>
|
||||
<td>3</td>
|
||||
<td>2</td>
|
||||
<td>2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Flush</td>
|
||||
<td class="border">♥</td>
|
||||
<td class="border">♥</td>
|
||||
<td class="border">♥</td>
|
||||
<td class="border">♥</td>
|
||||
<td class="border">♥</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Straight</td>
|
||||
<td>10</td>
|
||||
<td>J</td>
|
||||
<td>Q</td>
|
||||
<td>K</td>
|
||||
<td>A</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Three of a Kind</td>
|
||||
<td>K</td>
|
||||
<td>K</td>
|
||||
<td>K</td>
|
||||
<td>8</td>
|
||||
<td>A</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Two Pairs</td>
|
||||
<td>A</td>
|
||||
<td>A</td>
|
||||
<td>7</td>
|
||||
<td>7</td>
|
||||
<td>5</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>One Pair</td>
|
||||
<td>Q</td>
|
||||
<td>Q</td>
|
||||
<td>4</td>
|
||||
<td>6</td>
|
||||
<td>9</td>
|
||||
</tr>
|
||||
</table>
|
||||
<p>
|
||||
Ties broken by highest card.
|
||||
<br> Matched sets have priority.
|
||||
<br> Aces are high, except in A2345.
|
||||
</p>
|
||||
<p>
|
||||
<span class=border>99</span>542 >
|
||||
<span class=border>88</span>A6<span class="border">4</span> >
|
||||
88A6<span class="border">3</span>
|
||||
</p>
|
||||
<footer>©Nick 'nupa' Lamicela, 2023</footer>
|
||||
|
|
|
|||
|
|
@ -1,44 +1,44 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Nupa's Page</title>
|
||||
<meta charset='utf-8'/>
|
||||
<link rel='stylesheet' href='../style.css'>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
|
||||
<header>
|
||||
<h1>Russet</h1>
|
||||
<div class="subtitle">Or, how to reproduce my self-host server.</div>
|
||||
</header>
|
||||
|
||||
<section>
|
||||
<h2>Hardware</h2>
|
||||
<p>
|
||||
Russet runs on a Raspberry Pi, model 4b with 4GB RAM. It has an Argon metal heat dispersing shell. It's hooked up to a Microtik router over a wired home internet connection. You can use any small computer really. If Raspberry Pi is currently hard to obtain (2022) then I recommend the Pine64 "Rock64" computer as an alternative.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>Operating System</h2>
|
||||
<p>
|
||||
There are hundreds of guides on how to install Raspbian (or Armbian) on various systems. It usually boils down to "go download a disk image and write it to an sd card using some disk writing tool". I'll assume you can figure this part out without my help. The important thing for our purposes is that your OS is debian-based, so we have access to the now-familiar 'apt' package mananger (sorry, Arch fans).
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<!--
|
||||
TODO:
|
||||
- Configure sshd
|
||||
- Manage apps with Podman
|
||||
- Reverse proxy with Nginx
|
||||
-->
|
||||
|
||||
<section>
|
||||
<h2>Changelog</h2>
|
||||
<p>2022-12-13: New page.</p>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
</body>
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Nupa's Page</title>
|
||||
<meta charset='utf-8'/>
|
||||
<link rel='stylesheet' href='../style.css'>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
|
||||
<header>
|
||||
<h1>Russet</h1>
|
||||
<div class="subtitle">Or, how to reproduce my self-host server.</div>
|
||||
</header>
|
||||
|
||||
<section>
|
||||
<h2>Hardware</h2>
|
||||
<p>
|
||||
Russet runs on a Raspberry Pi, model 4b with 4GB RAM. It has an Argon metal heat dispersing shell. It's hooked up to a Microtik router over a wired home internet connection. You can use any small computer really. If Raspberry Pi is currently hard to obtain (2022) then I recommend the Pine64 "Rock64" computer as an alternative.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>Operating System</h2>
|
||||
<p>
|
||||
There are hundreds of guides on how to install Raspbian (or Armbian) on various systems. It usually boils down to "go download a disk image and write it to an sd card using some disk writing tool". I'll assume you can figure this part out without my help. The important thing for our purposes is that your OS is debian-based, so we have access to the now-familiar 'apt' package mananger (sorry, Arch fans).
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<!--
|
||||
TODO:
|
||||
- Configure sshd
|
||||
- Manage apps with Podman
|
||||
- Reverse proxy with Nginx
|
||||
-->
|
||||
|
||||
<section>
|
||||
<h2>Changelog</h2>
|
||||
<p>2022-12-13: New page.</p>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Reference in a new issue