Opengraph and banner

src/templates/src/landing.html

@@ -2,6 +2,7 @@
 
 {{ define "extrahead" }}
 <script src="{{ static "js/templates.js" }}"></script>
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet">
 {{ end }}
 
 {{ define "content" }}
@@ -119,22 +120,27 @@
             text-align: center;
         }
 
+		#jam-banner .jam-logo {
+			height: 7.25rem;
+		}
+
         #jam-banner h3 {
-            font-family: 'MohaveHMN', sans-serif;
+            font-family: 'Inter', sans-serif;
-            font-weight: normal;
+            font-weight: 700;
-            font-size: 2.2rem;
+            font-size: 2.31rem;
-            line-height: 0.8;
+            /* line-height: 0.8; */
             margin: 0;
-            text-transform: uppercase;
         }
 
+		#jam-title-container {
+			line-height: 1.25;
+		}
+
         #jam-details {
-            font-family: 'MohaveHMN', sans-serif;
+            font-family: 'Inter', sans-serif;
-            font-variant: small-caps;
             font-size: 1.2rem;
-            line-height: 0.8;
+            /* line-height: 0.8; */
-            margin-top: 0.6rem;
+            margin-top: 0.2rem;
-            letter-spacing: 0.02rem;
         }
 
         #jam-learn-more {
@@ -146,28 +152,57 @@
                 text-align: left;
             }
 
-            #jam-title-container {
+			#jam-banner h3 {
-                padding-top: 0.2rem;
+				font-size: 2.2rem;
-            }
+			}
+
+			#jam-banner .jam-logo {
+				height: 5.25rem;
+			}
         }
     </style>
 	<a id="jam-banner" class="pv3 ph3 ph4-l br3 flex flex-column flex-row-ns items-center" href="{{ .JamUrl }}">
-		<img class="h3" src="{{ static "wheeljam2023/logo.svg" }}">
+		<img class="jam-logo" src="{{ static "learningjam2024/logo.svg" }}">
 		<div id="jam-title-container" class="flex flex-column pl3-m pl4-l pv3 pv0-ns">
-			<h3 id="jam-title">The Learning Jam</h3>
+			<h3 id="jam-title">Learning Jam</h3>
 			<div id="jam-details">
-				March 15 - March 24.
+				<div class="db dn-ns">
-				{{ if gt .JamDaysUntilEnd 0 }}
+					<div>
-					{{ if eq .JamDaysUntilStart 0 }}
+						March 15-17. March 22-24.
-						<b>Happening now.</b>
+					</div>
-					{{ else if eq .JamDaysUntilStart 1 }}
+					<div>
-						<b>Starting tomorrow.</b>
+						{{ if gt .JamDaysUntilEnd 0 }}
-					{{ else }}
+							{{ if eq .JamDaysUntilStart 0 }}
-						<b>In {{ .JamDaysUntilStart }} days.</b>
+								<b>Happening now.</b>
-					{{ end }}
+							{{ else if eq .JamDaysUntilStart 1 }}
-				{{ else }}
+								<b>Starting tomorrow.</b>
-					<b>See the results.</b>
+							{{ else }}
-				{{ end }}
+								<b>In {{ .JamDaysUntilStart }} days.</b>
+							{{ end }}
+						{{ else }}
+							<b>See the results.</b>
+						{{ end }}
+					</div>
+				</div>
+				<div class="dn db-ns">
+					<div>
+						March 15-17.
+					</div>
+					<div>
+						March 22-24.
+						{{ if gt .JamDaysUntilEnd 0 }}
+							{{ if eq .JamDaysUntilStart 0 }}
+								<b>Happening now.</b>
+							{{ else if eq .JamDaysUntilStart 1 }}
+								<b>Starting tomorrow.</b>
+							{{ else }}
+								<b>In {{ .JamDaysUntilStart }} days.</b>
+							{{ end }}
+						{{ else }}
+							<b>See the results.</b>
+						{{ end }}
+					</div>
+				</div>
 			</div>
 		</div>
 		<div class="flex-grow-1"></div>

src/website/jam.go

@@ -53,8 +53,8 @@ func JamIndex2024_Learning(c *RequestContext) ResponseData {
 	baseData.OpenGraphItems = []templates.OpenGraphItem{
 		{Property: "og:site_name", Value: "Handmade Network"},
 		{Property: "og:type", Value: "website"},
-		{Property: "og:image", Value: hmnurl.BuildPublic("learningjam2024/opengraph.png", true)},
+		{Property: "og:image", Value: hmnurl.BuildPublic("learningjam2024/2024LJOpenGraph.png", true)},
-		{Property: "og:description", Value: "Need desc"},
+		{Property: "og:description", Value: "A two-weekend jam where you dive deep into a topic, then teach it to the rest of the community."},
 		{Property: "og:url", Value: hmnurl.BuildJamIndex2024_Learning()},
 	}