Skip to content

Commit

Permalink
Templates and CSS woo
Browse files Browse the repository at this point in the history
  • Loading branch information
htv04 committed Feb 20, 2024
1 parent 9ad845b commit a9d609a
Show file tree
Hide file tree
Showing 6 changed files with 176 additions and 39 deletions.
8 changes: 4 additions & 4 deletions Makefile
Original file line number Diff line number Diff line change
Expand Up @@ -29,11 +29,11 @@
all: root pages

# Pages
pages: root/images root/index.html
pages: root/favicon.ico root/index.html
root/%.html: src/pages/%.md root
pandoc $< -f markdown --wrap=none -t html -s -o $@
root/images: root
cp -r src/pages/images root/images
pandoc $< -f markdown --wrap=none --template=src/pages/template.html -t html -o $@
root/favicon.ico: src/pages/favicon.ico root
cp $< $@

# Website root
root:
Expand Down
File renamed without changes.
69 changes: 47 additions & 22 deletions root/index.html
Original file line number Diff line number Diff line change
@@ -1,38 +1,61 @@
<!DOCTYPE html>
<!-- htv04.com: HTV04’s Website -->
<html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang="">
<head>
<meta charset="utf-8" />
<meta name="generator" content="pandoc" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<meta name="author" content="HTV04" />
<meta name="dcterms.date" content="February 18, 2024" />
<meta name="dcterms.date" content="February 20, 2024" />
<title>htv04.com</title>
<link rel="shortcut icon" href="/favicon.ico">
<!-- TODO -->
<style>
code{white-space: pre-wrap;}
span.smallcaps{font-variant: small-caps;}
div.columns{display: flex; gap: min(4vw, 1.5em);}
div.column{flex: auto; overflow-x: auto;}
div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}
/* The extra [class] is a hack that increases specificity enough to
override a similar rule in reveal.js */
ul.task-list[class]{list-style: none;}
ul.task-list li input[type="checkbox"] {
font-size: inherit;
width: 0.8em;
margin: 0 0.8em 0.2em -1.6em;
vertical-align: middle;
}
.display.math{display: block; text-align: center; margin: 0.5rem auto;}
body {
background-color: mediumslateblue;
font-family: sans-serif;
color: beige;
}
@media screen and (orientation: landscape) {
body {
padding-left: 12.5%;
padding-right: 12.5%;
}
}
@media screen and (orientation: portrait) {
body {
padding-left: 6.25%;
padding-right: 6.25%;
}
}
body a {
color: orange;
}
body a:visited {
color: peru;
}
</style>
<link rel="icon" type="image/x-icon" href="/images/favicon.ico">
<!--[if lt IE 9]>
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>
<![endif]-->
</head>
<body>
<h1 id="htv04.com."><a href="https://htv04.com">htv04.com</a>.</h1>
<p>Welcome. Things are a little WIP around these parts, but everything great starts off somewhere, right?</p>
<p>…CSS? What’s that?</p>
<span style="text-align:center">
<img src="favicon.ico" alt="htv04.com">
<nav>
<span style="background-color:slateblue;padding:5px">
<a href="/">Home</a>
</span>
</nav>
</span>
<span style="color:goldenrod">
<header id="title-block-header">
<h1 class="title"><span style="background-color:slateblue;padding:5px">HTV04’s Website</span></h1>
</span>
</header>
</span>
<h2 id="welcome.">Welcome.</h2>
<p>Things are a little WIP around these parts, but everything great starts off somewhere, right?</p>
<h2 id="me.">Me.</h2>
<p>My name is Harrison. I’m currently 19 years old, and I live in the United States. I have many hobbies, but my favorite by far is software development. Why? Honestly, I’m not too sure. I just really like working on software. The best way I can describe it is that it’s like solving a complicated puzzle, but the result is something way more rewarding than a picture.</p>
<p>I also have a knack for reverse engineering and “hacking.” I’m not a l33t haxx0r or anything, but I do have an interest in checking out the internals of some of my favorite projects or hardware, and incorporating my own stuff into them.</p>
Expand All @@ -41,10 +64,12 @@ <h2 id="me.">Me.</h2>
<h2 id="projects.">Projects.</h2>
<p><a href="https://github.com/HTV04/funkin-rewritten">Friday Night Funkin’ Rewritten</a>: Optimized rewrite of Friday Night Funkin’ built on LÖVE. Runs on the Nintendo Switch! Haven’t worked on it in some time, though. You might want to check out <a href="https://github.com/VanillaEngineDevs/Vanilla-Engine">Vanilla Engine</a>, which is based on this project.</p>
<p><a href="https://github.com/HTV04/wiilove">WiiLÖVE</a>: A proof-of-concept Lua-based game engine for the Wii, based on the API of <a href="https://love2d.org/">LÖVE</a>.</p>
<p>rusty_???: A WIP ??? ??? written in Rust. Mainly written to help me learn Rust, but turned out to be a pretty interesting project.</p>
<p>???: Explore the ??? as ??? from ???, based on ???. My first real web project!</p>
<p><a href="https://github.com/HTV04/htv04.github.io">htv04.github.io</a>: This website!</p>
<p>I’ve worked on other things too, but I’m only posting the most notable ones here. Check out my <a href="https://github.com/HTV04">GitHub</a> for more!</p>
<h3 id="upcoming">Upcoming</h3>
<p>NOTE: Names and info will be redacted until release, but try to figure them out ;)</p>
<p>rusty_???: A WIP ??? ??? written in Rust. Mainly written to help me learn Rust, but turned out to be a pretty interesting project.</p>
<p>???: Explore the ??? as ??? from ???, based on ???. My first real web project!</p>
<h2 id="socials.">Socials.</h2>
<p><a href="https://twitter.com/HTV04_">X</a> | <a href="https://www.youtube.com/channel/UCF1lnrLYXDYWOc4y3W8-lPg">YouTube</a> | <a rel="me" href="https://mastodon.gamedev.place/@HTV04">Mastodon</a> | <a href="https://bsky.app/profile/htv04.bsky.social">Bluesky</a></p>
<p>Anything not listed here… Might be me, but also might not be me. Be cautious, and don’t hesitate to ask.</p>
Expand Down
File renamed without changes.
26 changes: 13 additions & 13 deletions src/pages/index.md
Original file line number Diff line number Diff line change
@@ -1,17 +1,12 @@
---
pagetitle: htv04.com
title-meta: htv04.com
title: HTV04's Website
author-meta: HTV04
date-meta: February 18, 2024
document-css: false
header-includes:
<link rel="icon" type="image/x-icon" href="/images/favicon.ico">
date-meta: February 20, 2024
---

# [htv04.com](https://htv04.com).
Welcome. Things are a little WIP around these parts, but everything great starts off somewhere, right?

...CSS? What's that?
## Welcome.
Things are a little WIP around these parts, but everything great starts off somewhere, right?

## Me.
My name is Harrison. I'm currently 19 years old, and I live in the United States. I have many hobbies, but my favorite by far is software development. Why? Honestly, I'm not too sure. I just really like working on software. The best way I can describe it is that it's like solving a complicated puzzle, but the result is something way more rewarding than a picture.
Expand All @@ -23,18 +18,23 @@ Finally, I'm a huge Linux and OSS enthusiast. Wherever I can, I run Linux (i use
...In other words, I'm a huge nerd. LOL

## Projects.

[Friday Night Funkin' Rewritten](https://github.com/HTV04/funkin-rewritten): Optimized rewrite of Friday Night Funkin' built on LÖVE. Runs on the Nintendo Switch! Haven't worked on it in some time, though. You might want to check out [Vanilla Engine](https://github.com/VanillaEngineDevs/Vanilla-Engine), which is based on this project.

[WiiLÖVE](https://github.com/HTV04/wiilove): A proof-of-concept Lua-based game engine for the Wii, based on the API of [LÖVE](https://love2d.org/).

rusty_???: A WIP ??? ??? written in Rust. Mainly written to help me learn Rust, but turned out to be a pretty interesting project.

???: Explore the ??? as ??? from ???, based on ???. My first real web project!

[htv04.github.io](https://github.com/HTV04/htv04.github.io): This website!

I've worked on other things too, but I'm only posting the most notable ones here. Check out my [GitHub](https://github.com/HTV04) for more!

### Upcoming

NOTE: Names and info will be redacted until release, but try to figure them out ;)

rusty_???: A WIP ??? ??? written in Rust. Mainly written to help me learn Rust, but turned out to be a pretty interesting project.

???: Explore the ??? as ??? from ???, based on ???. My first real web project!

## Socials.
[X](https://twitter.com/HTV04_) | [YouTube](https://www.youtube.com/channel/UCF1lnrLYXDYWOc4y3W8-lPg) | <a rel="me" href="https://mastodon.gamedev.place/@HTV04">Mastodon</a> | [Bluesky](https://bsky.app/profile/htv04.bsky.social)

Expand Down
112 changes: 112 additions & 0 deletions src/pages/template.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,112 @@
<!DOCTYPE html>
<!-- htv04.com: $title$ -->
<html xmlns="http://www.w3.org/1999/xhtml" lang="$lang$" xml:lang="$lang$"$if(dir)$ dir="$dir$"$endif$>
<head>
<meta charset="utf-8" />
<meta name="generator" content="pandoc" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
$for(author-meta)$
<meta name="author" content="$author-meta$" />
$endfor$
$if(date-meta)$
<meta name="dcterms.date" content="$date-meta$" />
$endif$
$if(keywords)$
<meta name="keywords" content="$for(keywords)$$keywords$$sep$, $endfor$" />
$endif$
$if(description-meta)$
<meta name="description" content="$description-meta$" />
$endif$
<title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title>
<link rel="shortcut icon" href="/favicon.ico">
<!-- TODO -->
<style>
body {
background-color: mediumslateblue;
font-family: sans-serif;
color: beige;
}
@media screen and (orientation: landscape) {
body {
padding-left: 12.5%;
padding-right: 12.5%;
}
}
@media screen and (orientation: portrait) {
body {
padding-left: 6.25%;
padding-right: 6.25%;
}
}
body a {
color: orange;
}
body a:visited {
color: peru;
}
</style>
$for(css)$
<link rel="stylesheet" href="$css$" />
$endfor$
$for(header-includes)$
$header-includes$
$endfor$
$if(math)$
$if(mathjax)$
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
$endif$
$math$
$endif$
<!--[if lt IE 9]>
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>
<![endif]-->
</head>
<body>
<span style="text-align:center">
<img src="favicon.ico" alt="htv04.com">
<nav>
<span style="background-color:slateblue;padding:5px">
<a href="/">Home</a>
</span>
</nav>
</span>
$for(include-before)$
$include-before$
$endfor$
$if(title)$
<span style="color:goldenrod">
<header id="title-block-header">
<h1 class="title"><span style="background-color:slateblue;padding:5px">$title$</span></h1>
$if(subtitle)$
<p class="subtitle">$subtitle$</p>
$endif$
$for(author)$
<p class="author">$author$</p>
$endfor$
$if(date)$
<p class="date">$date$</p>
$endif$
$if(abstract)$
<div class="abstract">
<div class="abstract-title">$abstract-title$</div>
$abstract$
</div>
$endif$
</span>
</header>
</span>
$endif$
$if(toc)$
<nav id="$idprefix$TOC" role="doc-toc">
$if(toc-title)$
<h2 id="$idprefix$toc-title">$toc-title$</h2>
$endif$
$table-of-contents$
</nav>
$endif$
$body$
$for(include-after)$
$include-after$
$endfor$
</body>
</html>

0 comments on commit a9d609a

Please sign in to comment.