From e653246e1571c7c3bd19929f32622b1ec1ad7426 Mon Sep 17 00:00:00 2001 From: Nick Lamicela Date: Fri, 3 Sep 2021 17:38:50 -0400 Subject: [PATCH] Simpler style using css border property for stripes --- .gitignore | 0 .../magenta-tile-1.png | Bin .../magenta-tile-2.png | Bin .../magenta-tile-3.png | Bin .../magenta-tile-4.png | Bin magenta-tiles.xcf => images/magenta-tile.xcf | Bin index.html | 79 ++++++++---------- style-1.css | 29 +++++++ style-2.css | 29 +++++++ style-3.css | 22 +++++ 10 files changed, 115 insertions(+), 44 deletions(-) create mode 100644 .gitignore rename magenta-tiles.png => images/magenta-tile-1.png (100%) rename magenta-tile-2.png => images/magenta-tile-2.png (100%) rename magenta-tile-3.png => images/magenta-tile-3.png (100%) rename magenta-tile-4.png => images/magenta-tile-4.png (100%) rename magenta-tiles.xcf => images/magenta-tile.xcf (100%) create mode 100644 style-1.css create mode 100644 style-2.css create mode 100644 style-3.css diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e69de29 diff --git a/magenta-tiles.png b/images/magenta-tile-1.png similarity index 100% rename from magenta-tiles.png rename to images/magenta-tile-1.png diff --git a/magenta-tile-2.png b/images/magenta-tile-2.png similarity index 100% rename from magenta-tile-2.png rename to images/magenta-tile-2.png diff --git a/magenta-tile-3.png b/images/magenta-tile-3.png similarity index 100% rename from magenta-tile-3.png rename to images/magenta-tile-3.png diff --git a/magenta-tile-4.png b/images/magenta-tile-4.png similarity index 100% rename from magenta-tile-4.png rename to images/magenta-tile-4.png diff --git a/magenta-tiles.xcf b/images/magenta-tile.xcf similarity index 100% rename from magenta-tiles.xcf rename to images/magenta-tile.xcf diff --git a/index.html b/index.html index 0ca6b47..250b96e 100644 --- a/index.html +++ b/index.html @@ -3,58 +3,49 @@ Nupa's Page + + - +

Nupa's Page

+A place to show off my projects. -

A place to show off my projects.

+
+
-

Stuff I've made:

+

Flistify

+

+ A script to bulk-resize images for an f-list gallery, using python and imagemagick. +

- +

Braceless Javascript

+

+ 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. +

+

Portal ZZT

+

+ 2008. A portal clone in the ZZT Engine. +

+ +

ZZT Nanogames

+

+ 2008. A collection of ZZT games that use only one screen each. Also includes Eight Legged Express, which I believe was made in one weekend as a challenge. +

+ +

Collabyrinth

+

+ 2008. +

+ +

Traps and Zoids

+

+ 2007. +

+ +
\ No newline at end of file diff --git a/style-1.css b/style-1.css new file mode 100644 index 0000000..03fb973 --- /dev/null +++ b/style-1.css @@ -0,0 +1,29 @@ +html { + margin: 0 auto; + max-width: 80ch; +} + +body { + background-image: url('images/magenta-tile-1.png'); + background-size: 2rem; + color: white; + text-shadow: 2px 2px black; + font-family: sans-serif; + font-weight: bold; + max-width: 120ch; +} + +h1, h3 { + text-align: center; +} + +ul { + list-style: none; + padding-left: 0px; +} + +li:before { + content: '●'; + padding: 20px; + text-shadow: 2px 2px black; +} \ No newline at end of file diff --git a/style-2.css b/style-2.css new file mode 100644 index 0000000..f4403ba --- /dev/null +++ b/style-2.css @@ -0,0 +1,29 @@ +html { + margin: 0 auto; + max-width: 80ch; +} + +body { + background-image: url('images/magenta-tile-4.png'); + background-size: 2rem; + color: darkgray; + text-shadow: 2px 2px black; + font-family: sans-serif; + font-weight: bold; + max-width: 120ch; +} + +h1, h3 { + text-align: center; +} + +ul { + list-style: none; + padding-left: 0px; +} + +li:before { + content: '●'; + padding: 20px; + text-shadow: 2px 2px black; +} \ No newline at end of file diff --git a/style-3.css b/style-3.css new file mode 100644 index 0000000..490ca60 --- /dev/null +++ b/style-3.css @@ -0,0 +1,22 @@ + +html { + margin: 0 auto; + max-width: 40rem; +} + +body { + font-family: sans-serif; + background-color: black; + color: hotpink; + max-width: 120ch; + border: 1rem double purple; + padding: 1rem; +} + +#title { + text-align: center; +} + +.subtitle { + font-style: italic; +}