feat: share cards

etchteam · Oct 14, 2024 · 768b2d0 · 768b2d0
1 parent 9c8d0a1
commit 768b2d0
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 1 deletion.
diff --git a/src/404.webc b/src/404.webc
@@ -1,7 +1,7 @@
 ---
 layout: default.webc
 title: 404
-description: The origin story of Diamond UI
+description: Page not found
 ---
 
 <diamond-wrap size="lg" class="diamond-spacing-bottom-fluid">

diff --git a/src/assets/share-cards/large.png b/src/assets/share-cards/large.png
diff --git a/src/assets/share-cards/medium.png b/src/assets/share-cards/medium.png
diff --git a/src/assets/share-cards/small.png b/src/assets/share-cards/small.png
diff --git a/src/layouts/default.webc b/src/layouts/default.webc
@@ -17,6 +17,34 @@
     <meta name="msapplication-config" content="/assets/icons/browserconfig.xml">
     <meta name="theme-color" content="#ffffff">
 
+    <!-- Share cards -->
+    <meta property="og:url" content="https://diamond.etch.co"/>
+    <meta property="og:site_name" content="Diamond UI"/>
+    <meta property="og:title" :content="title"/>
+    <meta property="og:description" :content="description"/>
+
+    <meta property="og:image" content="https://diamond.etch.co/images/share-cards/large.png"/>
+    <meta property="og:image:type" content="image/png"/>
+    <meta property="og:image:width" content="1200"/>
+    <meta property="og:image:height" content="630"/>
+    <meta property="og:image:alt" content="Diamond UI - Bring clarity to your components"/>
+
+    <meta property="og:image" content="https://diamond.etch.co/images/share-cards/medium.png"/>
+    <meta property="og:image:type" content="image/png"/>
+    <meta property="og:image:width" content="600"/>
+    <meta property="og:image:height" content="314"/>
+    <meta property="og:image:alt" content="Diamond UI - Bring clarity to your components"/>
+
+    <meta property="og:image" content="https://diamond.etch.co/images/share-cards/small.png"/>
+    <meta property="og:image:type" content="image/png"/>
+    <meta property="og:image:width" content="400"/>
+    <meta property="og:image:height" content="400"/>
+    <meta property="og:image:alt" content="Diamond UI - Bring clarity to your components"/>
+
+    <meta name="twitter:card" content="summary"/>
+    <meta name="twitter:site" content="@etch"/>
+    <meta name="twitter:creator" content="@etch"/>
+
     <!--- Bundled base styles --->
     <link rel="stylesheet" href="../../node_modules/@etchteam/diamond-ui/diamond-ui.css" webc:bucket="styles">
     <link rel="stylesheet" href="../styles/reset.css" webc:bucket="styles">