First pass at welcome banner

src/templates/src/include/header.html

@@ -1,5 +1,5 @@
 <header id="site-header" class="mb3 bb bw1 b--theme-dark">
-    <div class="user-options flex justify-center justify-end-ns">
+    <div class="user-options flex justify-center justify-end-ns relative">
         {{ if .User }}
             {{ if .User.IsStaff }}
                 <a class="admin-panel pa2" href="{{ .Header.AdminUrl }}"><span class="icon-settings"> Admin</span></a>

src/templates/src/landing.html

@@ -5,7 +5,7 @@
 {{ end }}
 
 {{ define "content" }}
-<div class="content-block pb3 ph3 ph0-ns">
+<div class="mb3 ph3 ph0-ns">
     <style>
         #hms-banner {
 			height: 10rem;
@@ -87,7 +87,7 @@
 			}
 		}
     </style>
-	<a id="hms-banner" class="pv3 ph3 ph4-l br3 flex flex-column flex-row-ns items-center" href="https://handmade-seattle.com/">
+	<a id="hms-banner" class="pv3 ph3 ph4-l br3 flex flex-column flex-row-ns items-center" href="https://handmade-seattle.com/" target="_blank">
         <div id="hms-title-container" class="flex flex-column pl3-m pl4-l pv3 pv0-ns z-1">
             <h3 id="hms-title">Handmade Seattle</h3>
             <div id="hms-details">November 11 - 12. In person and online.</div>
@@ -100,6 +100,70 @@
     </a>
 </div>
 
+{{ if not .User }}
+	<div class="mb3 ph3 ph0-ns">
+		<style>
+			#welcome {
+				background: linear-gradient(#ab4c47, #a5467d);
+				color: white;
+			}
+
+			#welcome-logo {
+				font-family: 'MohaveHMN', sans-serif;
+				font-weight: 400;
+				font-size: 4rem;
+			}
+			
+			#welcome-content a {
+				color: white !important;
+				text-decoration: underline;
+				font-weight: bold;
+			}
+
+			#welcome-actions {
+				margin-top: 1.5rem;
+			}
+
+			#welcome-actions a {
+				color: white !important;
+				text-decoration: none;
+				line-height: 1.4;
+				font-weight: 500;
+
+				transition: background-color 50ms ease-in-out;
+				background-color:rgba(255, 255, 255, 0.1);
+
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				text-align: center;
+			}
+
+			#welcome-actions a:hover {
+				background-color: rgba(255, 255, 255, 0.2);
+			}
+
+			#welcome-actions a:active {
+				background-color: rgba(255, 255, 255, 0.15);
+			}
+		</style>
+		<div id="welcome" class="br3 pa3 pa4-ns bg--card f5">
+			<h2 id="welcome-logo" class="tc pb3">HANDMADE</h2> <!-- TODO: logo -->
+			<div id="welcome-content" class="center-layout" style="max-width: 51rem">
+				<p class="b">We are a community of programmers committed to producing quality software through deeper understanding.</p>
+				<p>Originally inspired by Casey Muratori's <a href="https://handmadehero.org/" target="_blank">Handmade Hero</a>, we have grown into a thriving community focused on building truly high-quality software. We're not low-level in the typical sense. Instead we realize that to write great software, you need to understand things at more than a surface level.</p>
+				<p>Modern software is a mess. The status quo needs to change. But we're optimistic that we can change it.</p>
+				<p>Help us change the face of software.</p>
+			</div>
+			<div id="welcome-actions" class="flex flex-column flex-row-ns justify-center">
+				<a class="ba b--white br2 pa3 ph4-ns" href="{{ .ManifestoUrl }}">Read our manifesto</a>
+				<a class="ba b--white br2 pa3 ph4-ns mt3 mt0-ns ml3-ns" href="{{ .Header.ProjectIndexUrl }}">View Handmade projects</a>
+				<a class="ba b--white br2 pa3 ph4-ns mt3 mt0-ns ml3-ns" target="_blank" href="https://discord.gg/hxWxDee">Join our Discord</a>
+			</div>
+		</div>
+	</div>
+{{ end }}
+
 <div class="landing-layout ph3 ph0-ns">
 	{{/*
 		The order of the grid children should be as desired on mobile, then adapted to larger

src/website/landing.go

@@ -21,6 +21,7 @@ type LandingTemplateData struct {
 	Pagination           templates.Pagination
 	ShowcaseTimelineJson string
 
+	ManifestoUrl   string
 	FeedUrl        string
 	PodcastUrl     string
 	StreamsUrl     string
@@ -163,6 +164,7 @@ func Index(c *RequestContext) ResponseData {
 		Pagination:           pagination,
 		ShowcaseTimelineJson: showcaseJson,
 
+		ManifestoUrl:   hmnurl.BuildManifesto(),
 		FeedUrl:        hmnurl.BuildFeed(),
 		PodcastUrl:     hmnurl.BuildPodcast(models.HMNProjectSlug),
 		StreamsUrl:     hmnurl.BuildStreams(),