Simpler style using css border property for stripes
0
.gitignore
vendored
Normal file
Before Width: | Height: | Size: 672 B After Width: | Height: | Size: 672 B |
Before Width: | Height: | Size: 672 B After Width: | Height: | Size: 672 B |
Before Width: | Height: | Size: 665 B After Width: | Height: | Size: 665 B |
Before Width: | Height: | Size: 663 B After Width: | Height: | Size: 663 B |
79
index.html
|
@ -3,58 +3,49 @@
|
|||
<head>
|
||||
|
||||
<title>Nupa's Page</title>
|
||||
<meta charset='utf-8'/>
|
||||
<link rel='stylesheet' href='style-3.css'>
|
||||
|
||||
<style>
|
||||
|
||||
html {
|
||||
margin: 0 auto;
|
||||
max-width: 80ch;
|
||||
}
|
||||
|
||||
body {
|
||||
background-image: url('magenta-tile-4.png');
|
||||
background-size: 3vmin;
|
||||
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;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id='title'>
|
||||
|
||||
<h1>Nupa's Page</h1>
|
||||
<span class='subtitle'>A place to show off my projects.</span>
|
||||
|
||||
<h3>A place to show off my projects.</h3>
|
||||
</div>
|
||||
<div id='content'>
|
||||
|
||||
<h2>Stuff I've made:</h2>
|
||||
<h3>Flistify</h3>
|
||||
<p>
|
||||
A script to bulk-resize images for an f-list gallery, using python and imagemagick.
|
||||
</p>
|
||||
|
||||
<ul>
|
||||
<li>Portal ZZT</li>
|
||||
<li>The ZZT Nanogame Collection</li>
|
||||
<li>Collabyrinth, a ZZT collab</li>
|
||||
<li>My 2007 Homepage and drawings</li>
|
||||
<li>flistify: a script to bulk-resize images for f-list</li>
|
||||
<li>braceless-javascript: a subset of javascript that looks like lisp.</li>
|
||||
</ul>
|
||||
<h3>Braceless Javascript</h3>
|
||||
<p>
|
||||
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>
|
||||
|
||||
<h3>Portal ZZT</h3>
|
||||
<p>
|
||||
2008. A portal clone in the ZZT Engine.
|
||||
</p>
|
||||
|
||||
<h3>ZZT Nanogames</h3>
|
||||
<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>
|
||||
|
||||
<h3>Collabyrinth</h3>
|
||||
<p>
|
||||
2008.
|
||||
</p>
|
||||
|
||||
<h3>Traps and Zoids</h3>
|
||||
<p>
|
||||
2007.
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
29
style-1.css
Normal file
|
@ -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;
|
||||
}
|
29
style-2.css
Normal file
|
@ -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;
|
||||
}
|
22
style-3.css
Normal file
|
@ -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;
|
||||
}
|