commit f137df17ac33eaa77ce177998277a6d417e6d3e4 (patch)
parent f1ef4ee0acb462defb36a37f8028ecba4a8b7eb9
Author: Alex Karle <alex@alexkarle.com>
Date: Sun, 6 Nov 2022 19:59:27 -0500
build: Add simple templating system powered by make
Copying the header and footer around was proving a bit painful. This
should help!
Diffstat:
17 files changed, 177 insertions(+), 304 deletions(-)
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,3 @@
+*.html
+!footer.html
+!header.html
diff --git a/Makefile b/Makefile
@@ -0,0 +1,15 @@
+HTML != for f in *.tmpl; do echo $$(basename $$f tmpl)html; done
+
+.PHONY: build
+build: $(HTML)
+
+.PHONY: clean
+clean:
+ rm -f $(HTML)
+
+.SUFFIXES: .tmpl .html
+.tmpl.html:
+ (cat header.html; cat $<; cat footer.html) > $@
+
+$(HTML): header.html footer.html Makefile
+
diff --git a/event.html b/event.html
@@ -1,57 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width,initial-scale=1">
- <link rel="stylesheet" href="/style.css">
- <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png">
- <link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png">
- <title>Alex & Jennie's Wedding</title>
- </head>
-
- <body>
- <h1 class="index-title">Alex <small>&</small> Jennie</h1>
- <p class="subtitle">Tie the Knot</p>
- <nav>
- <a href="/">Home</a>
- <a href="/story.html">Our Story</a>
- <a href="/event.html">Event</a>
- <a href="/travel.html">Travel</a>
- <a href="/registry.html">Registry</a>
- </nav>
- <h2>Wedding Day Events</h2>
- <p>
- All festivities will take place at
- the <a href="https://www.endicottestate.com/">Endicott Estate</a>
- in Dedham, MA. See <a href="/travel.html">Travel</a> for more
- information.
- </p>
- <div class="event-schedule">
- <h3>Ceremony</h3>
- <p class="event-time"><em>4:30 - 5:00pm</em></p>
-
- </div>
- <p>
- We tie the knot and say our vows! Weather pending it will take
- place on the Endicott lawn.
- </p>
- <div class="event-schedule">
- <h3>Cocktail Hour</h3>
- <p class="event-time"><em>5:00 - 6:00pm</em></p>
- </div>
- <p>
- Grab a drink, catch up with old friends, and make some new
- ones before dinner.
- </p>
- <div class="event-schedule">
- <h3>Reception</h3>
- <p class="event-time"><em>6:00 - 10:00pm</em></p>
-
- </div>
- <p>
- There will be a plated dinner inside followed
- by an evening of dancing!
- </p>
- <footer>Copyright 2022, Alex Karle (<a href="license.html">License</a>)</footer>
- </body>
-</html>
diff --git a/event.tmpl b/event.tmpl
@@ -0,0 +1,33 @@
+<h2>Wedding Day Events</h2>
+<p>
+ All festivities will take place at
+ the <a href="https://www.endicottestate.com/">Endicott Estate</a>
+ in Dedham, MA. See <a href="/travel.html">Travel</a> for more
+ information.
+</p>
+<div class="event-schedule">
+ <h3>Ceremony</h3>
+ <p class="event-time"><em>4:30 - 5:00pm</em></p>
+
+</div>
+<p>
+ We tie the knot and say our vows! Weather pending it will take
+ place on the Endicott lawn.
+</p>
+<div class="event-schedule">
+ <h3>Cocktail Hour</h3>
+ <p class="event-time"><em>5:00 - 6:00pm</em></p>
+</div>
+<p>
+ Grab a drink, catch up with old friends, and make some new
+ ones before dinner.
+</p>
+<div class="event-schedule">
+ <h3>Reception</h3>
+ <p class="event-time"><em>6:00 - 10:00pm</em></p>
+
+</div>
+<p>
+ There will be a plated dinner inside followed
+ by an evening of dancing!
+</p>
diff --git a/footer.html b/footer.html
@@ -0,0 +1,3 @@
+ <footer>Copyright 2022, Alex Karle (<a href="license.html">License</a>)</footer>
+ </body>
+</html>
diff --git a/header.html b/header.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width,initial-scale=1">
+ <link rel="stylesheet" href="/style.css">
+ <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png">
+ <link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png">
+ <title>Alex & Jennie's Wedding</title>
+ </head>
+
+ <body>
+ <h1 class="index-title">Alex <small>&</small> Jennie</h1>
+ <p class="subtitle">Tie the Knot</p>
+ <nav>
+ <a href="/">Home</a>
+ <a href="/story.html">Our Story</a>
+ <a href="/event.html">Event</a>
+ <a href="/travel.html">Travel</a>
+ <a href="/registry.html">Registry</a>
+ </nav>
diff --git a/index.html b/index.html
@@ -1,46 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width,initial-scale=1">
- <link rel="stylesheet" href="/style.css">
- <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png">
- <link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png">
- <title>Alex & Jennie's Wedding</title>
- </head>
- <body>
- <h1 class="index-title">Alex <small>&</small> Jennie</h1>
- <p class="subtitle">Tie the Knot</p>
- <nav>
- <a href="/">Home</a>
- <a href="/story.html">Our Story</a>
- <a href="/event.html">Event</a>
- <a href="/travel.html">Travel</a>
- <a href="/registry.html">Registry</a>
- </nav>
- <img src="/static/acadia.jpg" alt="Alex and Jennie in Acadia"
- width="100%">
-
- <p class="index-joinus">
- Please join us for our wedding celebration on
- </p>
- <p class="index-date">
- September 9, 2023
- </p>
- <p class="index-daystill">
- <span id="daystill"></span>
- </p>
- <footer>Copyright 2022, Alex Karle (<a href="license.html">License</a>)</footer>
- <script>
- const now = new Date();
- const bigday = new Date("2023-09-09");
- const daysUntil = parseInt((bigday.getTime() - now.getTime()) / 1000 / 3600 / 24) + 1;
- if (daysUntil != 1) {
- document.getElementById("daystill").innerHTML = daysUntil + " days";
- } else {
- document.getElementById("daystill").innerHTML = daysUntil + " day";
- }
- document.getElementById("daystill").innerHTML += " until the big day!";
- </script>
- </body>
-</html>
diff --git a/index.tmpl b/index.tmpl
@@ -0,0 +1,22 @@
+<img src="/static/acadia.jpg" alt="Alex and Jennie in Acadia" width="100%">
+
+<p class="index-joinus">
+ Please join us for our wedding celebration on
+</p>
+<p class="index-date">
+ September 9, 2023
+</p>
+<p class="index-daystill">
+ <span id="daystill"></span>
+</p>
+<script>
+const now = new Date();
+const bigday = new Date("2023-09-09");
+const daysUntil = parseInt((bigday.getTime() - now.getTime()) / 1000 / 3600 / 24) + 1;
+if (daysUntil != 1) {
+ document.getElementById("daystill").innerHTML = daysUntil + " days";
+} else {
+ document.getElementById("daystill").innerHTML = daysUntil + " day";
+}
+document.getElementById("daystill").innerHTML += " until the big day!";
+</script>
diff --git a/license.html b/license.html
@@ -1,48 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width,initial-scale=1">
- <link rel="stylesheet" href="/style.css">
- <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png">
- <link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png">
- <title>Alex & Jennie's Wedding</title>
- </head>
- <body>
- <h1 class="index-title">Alex <small>&</small> Jennie</h1>
- <p class="subtitle">Tie the Knot</p>
- <nav>
- <a href="/">Home</a>
- <a href="/story.html">Our Story</a>
- <a href="/event.html">Event</a>
- <a href="/travel.html">Travel</a>
- <a href="/registry.html">Registry</a>
- </nav>
- <h2>Website License</h2>
- <p>
- Unless otherwise specified, all code for the website is
- licensed under the <a href="/LICENSE">MIT license</a> and can be
- found <a href="https://git.sr.ht/~akarle/jennex">here</a>.
- </p>
- <p>A few notable exceptions:</p>
- <ul>
- <li>
- Photos and content are not open source (all rights reserved).
- </li>
- <li>
- The cursive font in the title, which is the
- <a href="https://fonts.google.com/specimen/Allura">Allura font</a>,
- is licensed under the <a href="/static/OFL.txt">Open Font License</a>.
- </li>
- <li>
- The favicon emoji is part of the
- <a href="https://twemoji.twitter.com/">Twemoji</a>
- project and is licensed under the
- <a href="https://creativecommons.org/licenses/by/4.0/">CC-BY 4.0</a>
- license. Thanks to <a href="https://favicon.io">favicon.io</a>
- for making it easy to generate!
- </li>
- </ul>
- <footer>Copyright 2022, Alex Karle (<a href="license.html">License</a>)</footer>
- </body>
-</html>
diff --git a/license.tmpl b/license.tmpl
@@ -0,0 +1,25 @@
+<h2>Website License</h2>
+<p>
+ Unless otherwise specified, all code for the website is
+ licensed under the <a href="/LICENSE">MIT license</a> and can be
+ found <a href="https://git.sr.ht/~akarle/jennex">here</a>.
+</p>
+<p>A few notable exceptions:</p>
+<ul>
+ <li>
+ Photos and content are not open source (all rights reserved).
+ </li>
+ <li>
+ The cursive font in the title, which is the
+ <a href="https://fonts.google.com/specimen/Allura">Allura font</a>,
+ is licensed under the <a href="/static/OFL.txt">Open Font License</a>.
+ </li>
+ <li>
+ The favicon emoji is part of the
+ <a href="https://twemoji.twitter.com/">Twemoji</a>
+ project and is licensed under the
+ <a href="https://creativecommons.org/licenses/by/4.0/">CC-BY 4.0</a>
+ license. Thanks to <a href="https://favicon.io">favicon.io</a>
+ for making it easy to generate!
+ </li>
+</ul>
diff --git a/registry.html b/registry.html
@@ -1,34 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width,initial-scale=1">
- <link rel="stylesheet" href="/style.css">
- <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png">
- <link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png">
- <title>Alex & Jennie's Wedding</title>
- </head>
-
- <body>
- <h1 class="index-title">Alex <small>&</small> Jennie</h1>
- <p class="subtitle">Tie the Knot</p>
- <nav>
- <a href="/">Home</a>
- <a href="/story.html">Our Story</a>
- <a href="/event.html">Event</a>
- <a href="/travel.html">Travel</a>
- <a href="/registry.html">Registry</a>
- </nav>
- <h2>Gift Registry</h2>
- <p>
- The only gift we ask for is your presence on our wedding
- day—having our friends and family travel to spend the day with
- us is more than enough! That said, if you feel strongly that
- you'd like to buy us a gift, we put together a
- <a href="http://www.zola.com/registry/jennieandalexseptember9">
- wedding registry at Zola
- </a>.
- </p>
- <footer>Copyright 2022, Alex Karle (<a href="license.html">License</a>)</footer>
- </body>
-</html>
diff --git a/registry.tmpl b/registry.tmpl
@@ -0,0 +1,10 @@
+<h2>Gift Registry</h2>
+<p>
+ The only gift we ask for is your presence on our wedding
+ day—having our friends and family travel to spend the day with
+ us is more than enough! That said, if you feel strongly that
+ you'd like to buy us a gift, we put together a
+ <a href="http://www.zola.com/registry/jennieandalexseptember9">
+ wedding registry at Zola
+ </a>.
+</p>
diff --git a/rsvp.html b/rsvp.html
@@ -1,26 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width,initial-scale=1">
- <link rel="stylesheet" href="/style.css">
- <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png">
- <link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png">
- <title>Alex & Jennie's Wedding</title>
- </head>
-
- <body>
- <h1 class="index-title">Alex <small>&</small> Jennie</h1>
- <p class="subtitle">Tie the Knot</p>
- <nav>
- <a href="/">Home</a>
- <a href="/story.html">Our Story</a>
- <a href="/event.html">Event</a>
- <a href="/travel.html">Travel</a>
- <a href="/registry.html">Registry</a>
- </nav>
- <h2>RSVP</h2>
- <p>Check back soon for a form to fill out!</p>
- <footer>Copyright 2022, Alex Karle (<a href="license.html">License</a>)</footer>
- </body>
-</html>
diff --git a/story.html b/story.html
@@ -1,49 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width,initial-scale=1">
- <link rel="stylesheet" href="/style.css">
- <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png">
- <link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png">
- <title>Alex & Jennie's Wedding</title>
- </head>
-
- <body>
- <h1 class="index-title">Alex <small>&</small> Jennie</h1>
- <p class="subtitle">Tie the Knot</p>
- <nav>
- <a href="/">Home</a>
- <a href="/story.html">Our Story</a>
- <a href="/event.html">Event</a>
- <a href="/travel.html">Travel</a>
- <a href="/registry.html">Registry</a>
- </nav>
- <h2>Our Story</h2>
- <p>
- Alex and Jennie met in January 2017 at UMass Amherst through a
- mutual friend (thanks Rachana!) at a party, but they weren't sure
- if they'd see each other again. Fortunately, Rachana saw the
- potential and insisted on a group date later that week. Phone
- numbers were exchanged and just a day or so later they went on
- their first date in a snowstorm at the Frank dining commons. The
- rest is history!
- </p>
- <p>
- After graduation they moved to Natick, MA, and as soon as a
- landlord allowed it they adopted two kittens, Pulp and Meeks.
- 5 years, 4 jobs, 2 appartments, and 1 pandemic later, they're
- still there, supporting each other.
- </p>
- <p>
- After many trips together that left the family guessing if "he'd
- finally ask the question", Alex proposed to Jennie on August 20,
- 2022 on top of Franconia Ridge in the White Mountains. It was the
- exact spot they had hoped to be 4 years ago on a trip that they
- ended short due to bears, a heat wave, and blisters. Back years
- later and stronger than ever, she said yes!
- </p>
- <img src="/static/engagement.jpg" alt="Alex Proposes to Jennie" width="100%">
- <footer>Copyright 2022, Alex Karle (<a href="license.html">License</a>)</footer>
- </body>
-</html>
diff --git a/story.tmpl b/story.tmpl
@@ -0,0 +1,25 @@
+<h2>Our Story</h2>
+<p>
+ Alex and Jennie met in January 2017 at UMass Amherst through a
+ mutual friend (thanks Rachana!) at a party, but they weren't sure
+ if they'd see each other again. Fortunately, Rachana saw the
+ potential and insisted on a group date later that week. Phone
+ numbers were exchanged and just a day or so later they went on
+ their first date in a snowstorm at the Frank dining commons. The
+ rest is history!
+</p>
+<p>
+ After graduation they moved to Natick, MA, and as soon as a
+ landlord allowed it they adopted two kittens, Pulp and Meeks.
+ 5 years, 4 jobs, 2 appartments, and 1 pandemic later, they're
+ still there, supporting each other.
+</p>
+<p>
+ After many trips together that left the family guessing if "he'd
+ finally ask the question", Alex proposed to Jennie on August 20,
+ 2022 on top of Franconia Ridge in the White Mountains. It was the
+ exact spot they had hoped to be 4 years ago on a trip that they
+ ended short due to bears, a heat wave, and blisters. Back years
+ later and stronger than ever, she said yes!
+</p>
+<img src="/static/engagement.jpg" alt="Alex Proposes to Jennie" width="100%">
diff --git a/travel.html b/travel.html
@@ -1,44 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width,initial-scale=1">
- <link rel="stylesheet" href="/style.css">
- <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png">
- <link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png">
- <title>Alex & Jennie's Wedding</title>
- </head>
-
- <body>
- <h1 class="index-title">Alex <small>&</small> Jennie</h1>
- <p class="subtitle">Tie the Knot</p>
- <nav>
- <a href="/">Home</a>
- <a href="/story.html">Our Story</a>
- <a href="/event.html">Event</a>
- <a href="/travel.html">Travel</a>
- <a href="/registry.html">Registry</a>
- </nav>
- <h2>Travel</h2>
- <img src="/static/travel.jpg" alt="Alex and Jennie Roadtripping" width="100%">
- <h3>Wedding Venue</h3>
- <p>
- The ceremony and reception will both be at
- the <a href="https://www.endicottestate.com/">Endicott Estate</a>
- in Dedham, MA:
- </p>
- <p class="address">
- Endicott Estate<br>
- 656 East Street<br>
- Dedham, Massachusetts 02026
- </p>
- <p>
- <a href="https://www.google.com/maps/dir//Endicott+Estate,+656+East+St,+Dedham,+MA+02026/@42.2394849,-71.1658391,17z/">
- Google Maps Directions.
- </a>
- </p>
- <h3>Hotel Recommendations</h3>
- <p>Coming Soon</p>
- <footer>Copyright 2022, Alex Karle (<a href="license.html">License</a>)</footer>
- </body>
-</html>
diff --git a/travel.tmpl b/travel.tmpl
@@ -0,0 +1,20 @@
+<h2>Travel</h2>
+<img src="/static/travel.jpg" alt="Alex and Jennie Roadtripping" width="100%">
+<h3>Wedding Venue</h3>
+<p>
+ The ceremony and reception will both be at
+ the <a href="https://www.endicottestate.com/">Endicott Estate</a>
+ in Dedham, MA:
+</p>
+<p class="address">
+ Endicott Estate<br>
+ 656 East Street<br>
+ Dedham, Massachusetts 02026
+</p>
+<p>
+ <a href="https://www.google.com/maps/dir//Endicott+Estate,+656+East+St,+Dedham,+MA+02026/@42.2394849,-71.1658391,17z/">
+ Google Maps Directions.
+ </a>
+</p>
+<h3>Hotel Recommendations</h3>
+<p>Coming Soon</p>
