fix: account for js being disabled

package.json

@@ -1,6 +1,6 @@
 {
   "name": "coryd.dev",
-  "version": "6.2.7",
+  "version": "6.2.8",
   "description": "The source for my personal site. Built using 11ty and hosted on Netlify.",
   "type": "module",
   "scripts": {

src/_includes/partials/mastodon-post.liquid

@@ -18,9 +18,11 @@
     </dl>
   </div>
 </template>
-<mastodon-post>
-  <a href="{{ shareLink }}">
-    Discuss on Mastodon
-  </a>
-</mastodon-post>
+<span class="client-side">
+  <mastodon-post>
+    <a href="{{ shareLink }}">
+      Discuss on Mastodon
+    </a>
+  </mastodon-post>
+</span>
 {% endif -%}

src/_includes/partials/share-button.liquid

@@ -3,18 +3,20 @@
 {% endcapture %}
 <style>{{ css }}</style>
 <script type="module" src="/assets/scripts/share-button.js"></script>
-<share-button>
-  <button class="icon--small icon--center__vertical">{% tablericon "share" "Share" %}</button>
-  <label>
-    Share this page
-    <input
-      type="url"
-      readonly
-      value="{{ url }}"
-      onclick="this.select()"
-    />
-  </label>
-</share-button>
+<span class="client-side">
+  <share-button>
+    <button class="icon--small icon--center__vertical">{% tablericon "share" "Share" %}</button>
+    <label>
+      Share this page
+      <input
+        type="url"
+        readonly
+        value="{{ url }}"
+        onclick="this.select()"
+      />
+    </label>
+  </share-button>
+</span>
 <style>
   share-button:not(:defined) button,
   share-button:defined label {

src/_includes/post.liquid

@@ -14,7 +14,10 @@ schema: blog
     <h2 class="p-name" data-pagefind-meta="title">{{ title }}</h2>
     <span class="p-author h-card hidden">{{ meta.author }}</span>
     <div class="flex--centered">
-      <time class="dt-published" datetime="{{ date }}">{{ date | readableDate }} • </time>
+      <time class="dt-published" datetime="{{ date }}">
+        {{ date | readableDate }}
+        <span class="client-side"> • </span>
+      </time>
       {% render "partials/share-button.liquid", url:postUrl %}
     </div>
     <div class="p-summary hidden">{{ post_excerpt }}</div>