add a collection of crosswords to the site

This commit is contained in:
Holly 2023-12-25 06:41:35 +00:00
parent 1f1ea1e4e3
commit 90e1ade05b
14 changed files with 163 additions and 1 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 518 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 432 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 489 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 528 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 530 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

71
crosswords/index.html Normal file
View File

@ -0,0 +1,71 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My Crossword Constructions</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>My Crossword Constructions</h1>
<p>I've been dabbling in constructing US newspaper-style crossword puzzles! This page is a repository of the puzzles I've created and a little bit of author commentary for each. There are links for each to a playable version online, as well as to a standard .puz file to be played in the software of your choice.</p>
<hr />
<div class="block">
<figure><img src="img/Ups and Downs.png" alt="A 15x15 crossword grid" /></figure>
<h2>Ups and Downs</h2>
<h4>Grid: 15x15</h4>
<h4>Rating: <span class="rating">CERULEAN THROWDOWN</span></h4>
<p>This was the first crossword I constructed! There was obvious room for improvement; there are a couple of unchecked squares that I accidentally introduced while adjusting the grid, for example. Rather than throw out more work than I was comfortable with, I just made a joke about it in one of the clues. I'm proud of it as a first effort.</p>
<p>This puzzle was, in a way, a collaboration with my friend Amy (it's complicated, don't worry about it). The theme clues refer to the two of us by name, and they're pretty unfair if you don't know us personally. For a hint at the theme to get you started without knowing both of us, hover over the following text block:</p>
<p><span class="spoiler">My fursona is 80 feet tall. Amy's not a furry, but her online persona is just a touch over 4 inches tall. Our extreme sizes are the joke in the theme clues.</span></p>
<p>I like the theme, though it has a pretty specific target audience (a couple other clues in the grid are nods to people or jokes from my corner of the fediverse, though they have less of an impact on the solve than the theme does), and it came together well.</p>
<h5><a href="https://crosshare.org/crosswords/FT19VUTr4FyfOMLQWfSG/ups-and-downs" target="_blank" rel="noopener noreferrer">Play online</a> <a href="puz/Ups and Down.puz">Download .puz</a></h5>
</div>
<hr />
<div class="block">
<figure><img src="img/Two or More.png" alt="A 15x15 crossword grid" /></figure>
<h2>Two or More</h2>
<h4>Grid: 15x15</h4>
<h4>Rating: <span class="rating">LETTERBOMB BURIAL</span></h4>
<p>My second crossword, and my second collaboration with Amy (again, in a way). If you know, you know. If you don't: After solving the puzzle, you'll know!</p>
<p>I'm really proud of the theme here, I think the way it manifests is funny and it's all tied to something close to my heart. It's not perfect, though. If you aren't already familiar with the core concept that the theme is built around, you'll have to get it from crosses, because working backwards from the other theme words is pretty unlikely. A number of solvers have also told me that it wasn't until near the end or even <em>after</em> the end of the solve that they worked out how the highlighted answers actually tied into the theme.</p>
<p>If you did the puzzle and still need help getting it, here's how the theme works: <span class="spoiler">Each of the highlighted answers is the first half of a common "___ system" phrase, made plural. So "buddy system" becomes BUDDIES, for example.</span> Is it too cute for its own good? Who knows!</p>
<h5><a href="https://crosshare.org/crosswords/Ce5mbjIqxa8F35ohlIL1/two-or-more" target="_blank" rel="noopener noreferrer">Play online</a> <a href="puz/Two or More.puz">Download .puz</a></h5>
</div>
<hr />
<div class="block">
<figure><img src="img/TEXT WITHOUT EMPTY IS WIN.png" alt="A 10x10 crossword grid" /></figure>
<figure class="baba-puzzle-title" alt="Text boxes from the game Baba Is You that read &quot;TEXT WITHOUT EMPTY IS WIN&quot;"><img src="baba-puzzle-title/text.png"><img src="baba-puzzle-title/without.png"><img src="baba-puzzle-title/empty.png"><img src="baba-puzzle-title/is.png"><img src="baba-puzzle-title/win.png"></figure>
<h4>Grid: 10x10</h4>
<h4>Rating: <span class="rating">METICULOUS BYPASS</span></h4>
<p>This was the first puzzle I created entirely on my own. I came up with the theme and then struggled <em>hard</em> to fit it into an actual grid. I wanted to try constructing something a bit smaller, since my first two had been 15x15 puzzles, which is "standard" for newspapers but can be a lot for new solvers just checking out what their friends made.</p>
<p>What I discovered is that laying out a smaller grid is really, really tough. Many times I'd lay out my theme words in a way that made sense, only to discover that the desicion I made had incredibly wide-reaching consequnces for what the grid could look like. I'd find myself in a situation where I had to either include a lot of nearly grid-spanning words, which is very very difficult to do, or be forced into having unchecked squares or words shorter than three letters. Eventually, I found a way to have my four theme words in the two center rows and two center columns of the grid, which I was very proud of, and constructing around that got me this layout. I didn't notice until after the fill that more than 70% of the words were exactly three letters long. Whoops!</p>
<p>If you don't understand the title to this puzzle, you may find yourself struggling with it. Heads up :P</p>
<h5><a href="https://crosshare.org/crosswords/8dISn3dKMNIGPVh9Y9lQ/text-without-empty-is-win" target="_blank" rel="noopener noreferrer">Play online</a> <a href="puz/TEXT WITHOUT EMPTY IS WIN.puz">Download .puz</a></h5>
</div>
<footer>
<p><a href="..">Back to home</a></p>
</footer>
</body>
</html>

Binary file not shown.

Binary file not shown.

Binary file not shown.

91
crosswords/style.css Normal file
View File

@ -0,0 +1,91 @@
:root {
--bg-color: #D0D0D0;
--text-color: #111111;
--spoiler-color: #bbbbbb;
--highlight-color: #EEEEEE;
}
body {
width: inherit;
margin: 1.5em 20%;
font-family: Sans-Serif;
font-size: 14pt;
background-color: var(--bg-color);
color: var(--text-color);
}
/*
@media screen and (max-width: 900px) {
body {
width: 90%;
}
}
*/
footer {
padding: 0 4em;
font-size: 10pt;
text-align: center;
}
figure {
float: right;
width: 30%;
}
figure.baba-puzzle-title {
display: flex;
width: min-content;
float: none;
margin: 0.4em auto 0 auto;
}
figure.baba-puzzle-title > img {
height: 30px;
width: auto;
float: none;
}
img {
display: block;
margin-left: auto;
margin-right: auto;
width: 100%;
height: auto;
float: right;
}
h1, h2, h4 {
text-align: center;
margin-top: 0;
margin-bottom: 0;
}
.block {
overflow: auto;
}
.block > h2 {
margin-top: 0.25em;
}
.rating {
display: inline-block;
font-family: monospace;
font-size: 15.3pt;
letter-spacing: 0.15rem;
background-color: var(--highlight-color);
padding-left: 0.225rem;
padding-right: 0.1rem;
}
.spoiler {
background-color: var(--spoiler-color);
color: var(--spoiler-color);
padding-left: 0.25rem;
padding-right: 0.2rem;
box-decoration-break: clone;
}
.spoiler:hover {
color: var(--text-color);
}

View File

@ -15,7 +15,7 @@
<ul>
<li><a href="aboutme">aboutme</a></li>
<li><a href="montyhall">an intuitive explanation of the monty hall problem</a></li>
<li><a href="wordle">wordle, rehosted here with the 2300 or so pre-planned puzzles intact. for whenever the nyt starts charging for it</a></li>
<li><a href="crosswords">a small collection of crossword puzzles i've constructed</a></li>
<li><a href="https://git.hollymcfarland.com">my gitea page</a></li>
<li><a href="https://glaceon.social/@monorail">my profile on the fediverse</a></li>
<li>that's the whole list</li>