Opengraph and banner

This commit is contained in:
Ben Visness 2024-02-10 22:06:43 -06:00
parent 97e6c74c52
commit 16e4b0327f
4 changed files with 64 additions and 29 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 228 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 267 KiB

View File

@ -2,6 +2,7 @@
{{ define "extrahead" }} {{ define "extrahead" }}
<script src="{{ static "js/templates.js" }}"></script> <script src="{{ static "js/templates.js" }}"></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet">
{{ end }} {{ end }}
{{ define "content" }} {{ define "content" }}
@ -119,22 +120,27 @@
text-align: center; text-align: center;
} }
#jam-banner .jam-logo {
height: 7.25rem;
}
#jam-banner h3 { #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; margin: 0;
text-transform: uppercase; }
#jam-title-container {
line-height: 1.25;
} }
#jam-details { #jam-details {
font-family: 'MohaveHMN', sans-serif; font-family: 'Inter', sans-serif;
font-variant: small-caps;
font-size: 1.2rem; 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 { #jam-learn-more {
@ -146,17 +152,25 @@
text-align: left; 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> </style>
<a id="jam-banner" class="pv3 ph3 ph4-l br3 flex flex-column flex-row-ns items-center" href="{{ .JamUrl }}"> <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"> <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"> <div id="jam-details">
March 15 - March 24. <div class="db dn-ns">
<div>
March 15-17. March 22-24.
</div>
<div>
{{ if gt .JamDaysUntilEnd 0 }} {{ if gt .JamDaysUntilEnd 0 }}
{{ if eq .JamDaysUntilStart 0 }} {{ if eq .JamDaysUntilStart 0 }}
<b>Happening now.</b> <b>Happening now.</b>
@ -170,6 +184,27 @@
{{ end }} {{ end }}
</div> </div>
</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> <div class="flex-grow-1"></div>
<div id="jam-learn-more"> <div id="jam-learn-more">
Learn more Learn more

View File

@ -53,8 +53,8 @@ func JamIndex2024_Learning(c *RequestContext) ResponseData {
baseData.OpenGraphItems = []templates.OpenGraphItem{ baseData.OpenGraphItems = []templates.OpenGraphItem{
{Property: "og:site_name", Value: "Handmade Network"}, {Property: "og:site_name", Value: "Handmade Network"},
{Property: "og:type", Value: "website"}, {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()}, {Property: "og:url", Value: hmnurl.BuildJamIndex2024_Learning()},
} }