Adding titlecards

pages/gdb/index.md

@@ -5,9 +5,9 @@ description: "A dive into the multitude of ways that gender dysphoria manifests
 
 ---
 
-# The Gender Dysphoria Bible
 
 {!{
+{{import '~/img' images.titlecard srcSizes="(max-width: 800px) 100vw, (max-width: 1000px) 70vw, 767px" alt="The Gender Dysphoria Bible" style="margin-bottom: 1em;"}}
 <div class="gutter"><blockquote>
   <strong>Trans·gen·der</strong> - <em>adjective</em><br>
   Denoting or relating to a person whose sense of personal identity and gender does not correspond with their sex assigned at birth.
@@ -28,4 +28,14 @@ This experience of discontinuity between the internal and external self is what
 
 The purpose of this site is to document the many ways that Gender Dysphoria manifests, as well as other aspects of gender transition, in order to provide a guide for those who are questioning, those who are starting, those already on their path, and those who simply wish to be better allies.
 
+{!{
+<div class="gutter flex" style="justify-content: flex-end">
+<span>Title artwork based on works by <a href="https://www.instagram.com/jp_means_jumpei/">Jumpei JP Ueoka</a></span>
+<div class="grid-row" style="grid-template-columns: 1fr 1fr">
+{{import '~/img' images.jpjumpei_1 className="" link="https://www.instagram.com/p/Bq2uRCtFttU/"}}
+{{import '~/img' images.jpjumpei_2 className="" link="https://www.instagram.com/p/BlA3IUrAnTi/"}}
+</div>
+</div>
+}!}
+
 {!{ {{import '_pager'}} }!}

pages/index.html

@@ -3,12 +3,12 @@
   {{#content "meta"}}
   <meta property="og:title" content="{{meta.title}}">
   <meta property="og:description" content="{{meta.description}}">
-  {{!-- <meta property="og:image" content="https://{{page.domain}}{{rev '/images/titlecard.jpg'}}"> --}}
+  <meta property="og:image" content="https://{{page.domain}}{{rev '/images/titlecard.jpg'}}">
   <meta property="og:url" content="https://{{page.domain}}">
   <meta name="twitter:title" content="{{meta.title}}">
   <meta name="twitter:description" content="{{meta.description}}">
   <meta name="twitter:card" content="summary_large_image">
-  {{!-- <meta name="twitter:image" content="https://{{page.domain}}{{rev '/images/titlecard.jpg'}}"> --}}
+  <meta name="twitter:image" content="https://{{page.domain}}{{rev '/images/titlecard.jpg'}}">
   {{/content}}
 
   {{#content "bodyClass"}}front-page{{/content}}

templates/post.hbs

@@ -3,13 +3,13 @@
   {{#content "meta"}}
   <meta property="og:title" content="{{meta.title}}{{#if meta.subtitle}}, {{meta.subtitle}}{{/if}}">
   <meta property="og:description" content="{{meta.description}}">
-  {{!-- {{#if titlecard}}<meta property="og:image" content="https://{{page.domain}}{{rev titlecard}}">{{/if}} --}}
+  {{#if titlecard}}<meta property="og:image" content="https://{{page.domain}}{{rev titlecard}}">{{/if}}
   <meta property="og:url" content="https://{{page.domain}}{{url}}">
   <meta name="twitter:title" content="{{meta.title}}{{#if meta.subtitle}}, {{meta.subtitle}}{{/if}}">
   <meta name="twitter:description" content="{{meta.description}}">
   {{#if titlecard}}
   <meta name="twitter:card" content="summary_large_image">
-  {{!-- <meta name="twitter:image" content="https://{{page.domain}}{{rev titlecard}}"> --}}
+  <meta name="twitter:image" content="https://{{page.domain}}{{rev titlecard}}">
   {{/if}}
   <link rel="canonical" href="https://{{page.domain}}{{url}}">{{/content}}