site/zedshaw.games
1
0
Fork 0
Code Issues 7 Pull requests Projects Releases Packages Wiki Activity Actions

Landing page is designed now.

Browse source
This commit is contained in:
Zed A. Shaw 2025-09-14 13:33:33 -04:00
parent e1df377eea
commit a2f9660d81
8 changed files with 98 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

91
pages/index.html
View file

@ -1,64 +1,89 @@
<h1>Zed's Game Dev Website</h1>
<script src="https://player.twitch.tv/js/embed/v1.js"></script>
<div class="flex flex-col flex-start">
<shape class="video bg-gray-950! font-bold gap-8">
<button class="hover:btn-hover bg-gray-200"><a id="streams" href="/stream/">View Past Streams</a></button>
<button class="hover:btn-hover bg-gray-200"><a id="live" href="/live/">Watch Today's Livestream</a></button>
<shape id="twitch-player" class="video bg-gray-950! font-bold gap-8">
</shape>
</div>
<block class="bg-gray-300 dark:bg-gray-800" data-testid="clickblock">
<p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit​​, morbo vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby.
</p>
<p class="text-xl">Hi, my name is Zed and this i where I post things about my games that I'm making.</p>
</block>
<block>
<grid class="grid-cols-2">
<shape class="xxs">Left Image</shape>
<div>
<img src="/images/buckaroo_bonzai.png" />
<block>
<h3>I stream on Twitch.</h3>
<p>I stream every day at 10AM/10PM EST time. 60% of the time it's a chill laid back stream with only programming and a bit of talking about programming. 30% of the time it's art for games I'm making. 10% of the time it's games I'm playing.</p>
<a href="https://twitch.tv/zedashaw"><button style="--value: 2; --text: 9">Watch me on Twitch</button></a>
</div>
</block>
</grid>
</block>
<block class="bg-gray-300 dark:bg-gray-800">
<p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit​​, morbo vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby.
<p class="text-xl">In the year 2025 I decided to finally take all of my skills and apply them tothe challenge of creating games. I figured, "Hey, games are nothing more than paintings and music with code attached. How hard could it be?" Turns out, not only is it challenging but it's <b>fun</b>.</p>
</block>
<block>
<grid class="grid-cols-2">
<block>
<h2>Play My Games</h2>
<p>Are you a fan of retro styled jank but fun games? Me too, so here's my games I've made with that theme. Think "it's the late 80s and nobody knows how to make a game" when you play these and you'll enjoy every minute of it. Hopefully.</p>
<a href="/game/"><button style="--value: 2; --text: 9">Play my Games</button></a>
</block>
<img src="/images/rat_king_emote.gif" />
</grid>
</block>
<block class="bg-gray-300 dark:bg-gray-800">
<p class="text-xl">I try to share all of my code online for people to review. Some of it is open source, but other projects are simply copyright. You're can view and play them if they're published here. I treat programming as a form of self-expression similar to my painting and writing. Given that <a href="https://en.wikipedia.org/wiki/Bernstein_v._United_States">code is speech according to the Supreme Court</a> then I am allowed to publish my code without a license in the same way that I publish my blog posts and paintings without a license.</p>
</block>
<block>
<grid class="grid-cols-2">
<img src="/images/vim_window_clip.jpg" />
<block>
<h2>Checkout my Git</h2>
<p>If you're curious about the code behind my games or anything else I make then take a look at my git. It's like a buffet of half-finished genius.</p>
<a href="https://git.zedshaw.games/games"><button style="--value: 2; --text: 9">View my Git</button></a>
</block>
</grid>
</block>
<block class="bg-gray-300 dark:bg-gray-800">
<h2 class="!text-3xl">Contact Me</h2>
<p>If you'd like to contact me about what you see here then email me at <a href="mailto:help@learncodethehardway.com">help@learncodethehardway.com</a>. It might take me about a day to respond.
</p>
</block>
<block>
<grid class="grid-cols-2">
<div>
<h2>Zed's Trash Ass Games</h2>
<p>Are you a fan of retro styled half-assed but fun games? Me too, so here's my games I've made with that theme. Think "it's the late 80s and nobody knows how to make a game" when you play these and you'll enjoy every minute of it.</p>
<h2>I Like to Paint</h2>
<p>All of the art in my games is original paintings that I process with a bunch of jank imagemagick scripts to give it that "80s/90s retro" look. I frequently do paintings live on Twitch, and I post most of the art here as well.</p>
<a href="/game/"><button style="--value: 2; --text: 9">Play my Games</button></a>
<a href="/game/"><button style="--value: 2; --text: 9">View my Art</button></a>
</div>
<shape>Right Image</shape>
<img src="/images/Hawaii_Truck.jpg" />
</grid>
</block>
<block class="bg-gray-300 dark:bg-gray-800">
<p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit​​, morbo vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby.
</p>
</block>
<block>
<grid class="grid-cols-2">
<shape class="shape-xs hover:bg-gray-950 bg-gray-400">Left Image</shape>
<div>
<h2>Checkout my Git</h2>
<p>I put al of my code online for people to read and study. If you're curious about the code behind my games or anything else I make then take a look at my git. It's like a buffet of half-finished genius.</p>
<a href="https://git.learnjsthehardway.com"><button style="--value: 2; --text: 9">View my Git</button></a>
</div>
</grid>
</block>
<block class="bg-gray-300 dark:bg-gray-800">
<p>Zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus brains sit​​, morbo vel maleficia? De apocalypsi gorger omero undead survivor dictum mauris. Hi mindless mortuis soulless creaturas, imo evil stalking monstra adventus resi dentevil vultus comedat cerebella viventium. Qui animated corpse, cricket bat max brucks terribilem incessu zomby.
</p>
</block>
<script>
var options = {
width: "100%",
height: "100%",
autoplay: false,
muted: true,
channel: "zedashaw"
};
var player = new Twitch.Player("twitch-player", options);
player.setVolume(0.5);
</script>

BIN
static/images/Hawaii_Truck.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 169 KiB

BIN
static/images/buckaroo_bonzai.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 216 KiB

BIN
static/images/rat_king_emote.gif Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 399 KiB

BIN
static/images/vim_window_clip.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 140 KiB

4
static/input_style.css
View file

@ -25,6 +25,10 @@ nav {
@apply flex justify-center items-center bg-gray-950 *:text-gray-50 *:flex-1 *:text-xl w-full justify-evenly;
}
a {
@apply underline;
}
nav > a {
@apply flex justify-center items-center pt-1;
}

27
static/style.css
View file

@ -499,6 +499,15 @@
.pt-4 {
padding-top: calc(var(--spacing) * 4);
}
.\!pb-4 {
padding-bottom: calc(var(--spacing) * 4) !important;
}
.\!pb-10 {
padding-bottom: calc(var(--spacing) * 10) !important;
}
.\!pb-20 {
padding-bottom: calc(var(--spacing) * 20) !important;
}
.pb-0\! {
padding-bottom: calc(var(--spacing) * 0) !important;
}
@ -517,6 +526,9 @@
.pb-8 {
padding-bottom: calc(var(--spacing) * 8);
}
.pb-10 {
padding-bottom: calc(var(--spacing) * 10);
}
.pb-10\! {
padding-bottom: calc(var(--spacing) * 10) !important;
}
@ -529,6 +541,18 @@
.align-top {
vertical-align: top;
}
.\!text-2xl {
font-size: var(--text-2xl) !important;
line-height: var(--tw-leading, var(--text-2xl--line-height)) !important;
}
.\!text-3xl {
font-size: var(--text-3xl) !important;
line-height: var(--tw-leading, var(--text-3xl--line-height)) !important;
}
.\!text-xl {
font-size: var(--text-xl) !important;
line-height: var(--tw-leading, var(--text-xl--line-height)) !important;
}
.text-2xl {
font-size: var(--text-2xl);
line-height: var(--tw-leading, var(--text-2xl--line-height));
@ -689,6 +713,9 @@ nav {
color: var(--color-gray-50);
}
}
a {
text-decoration-line: underline;
}
nav > a {
display: flex;
align-items: center;

12
views/layouts/main.html
View file

@ -38,16 +38,22 @@
{{embed}}
</main>
<footer>
<footer class="!p-4 !pb-20">
<div class="flex-1">
<img class="size-12 shrink-0" src="/logo.png" />
<div>
<p>Blah blah about me.</p>
<p>I'm the author of many programming education books, a
semi-professional oil painter, and new game developer.</p>
</div>
</div>
<div class="flex-1">
<h3 class="text-3xl">Other Projects</h3>
<p>Some other links to stuff.</p>
<ul>
<li><a href="https://learncodethehardway.com/">Learn Code the Hard Way</a></li>
<li><a href="https://lcthw.dev/go/">Go Web Dev</a></li>
<li><a href="https://lcthw.dev/learn-code-the-hard-way/">Code Projects for Beginners</a></li>
<li><a href="https://zedshaw.com/blog/">Personal Essays</a></li>
</ul>
</div>
</footer>
</body>