fix: preview

index.html

@@ -11,14 +11,14 @@
       content="Wonderland is the largest core development group in Web3. We partner up with the best protocols in the world, including, among others: Optimism, Connext, and Reflexer."
     />
     <meta name="author" content="Wonderland" />
-    <meta property="og:url" content="https://defi.sucks" />
+    <!-- <meta property="og:url" content="https://defi.sucks" />
     <meta property="og:type" content="website" />
     <meta property="og:title" content="Wonderland" />
     <meta
       property="og:description"
       content="Wonderland is the largest core development group in Web3. We partner up with the best protocols in the world, including, among others: Optimism, Connext, and Reflexer."
     />
-    <meta property="og:image" content="https://defi.sucks/share.jpg" />
+    <meta property="og:image" content="https://defi.sucks/share.jpg" /> -->
     <meta name="twitter:card" content="summary_large_image" />
     <meta name="twitter:site" content="@DeFi_wonderlnad" />
     <meta name="twitter:creator" content="@DeFi_wonderland" />

src/components/common/DocumentHead.tsx

@@ -10,10 +10,10 @@ export const DocumentHead = ({ name, description, image }: Props) => {
   return (
     <Helmet>
       <title>{name} - Wonderland</title>
+      {description && <meta name='description' content={description} />}
+
       <meta property='og:url' content={`https://defi.sucks${location.pathname}`} />
       <meta property='og:title' content={`${name} - Wonderland`} />
-
-      {description && <meta name='description' content={description} />}
       {description && <meta property='og:description' content={description} />}
       {image && <meta property='og:image' content={`https://defi.sucks/${image}`} />}
     </Helmet>

src/pages/Landing/Intro.tsx

@@ -4,7 +4,7 @@ import styled from 'styled-components';
 import { Footer, Navbar, StarsBackground } from '~/containers';
 import { Landing } from './Landing';
 import { Intro } from './IntroMask/Intro';
-import { MOBILE_MAX_WIDTH } from '~/components/common';
+import { DocumentHead, MOBILE_MAX_WIDTH } from '~/components/common';
 import { useStateContext } from '~/hooks/useStateContext';
 
 export interface StyledContainerProps {
@@ -26,6 +26,12 @@ export function IntroductionPage() {
 
   return (
     <>
+      <DocumentHead
+        name='Wonderland'
+        description='Wonderland is the largest core development group in Web3. We partner up with the best protocols in the world, including, among others: Optimism, Connext, and Reflexer.'
+        image={`share.jpg`}
+      />
+
       {isLoaded && (
         <>
           <StarsBackground zIndex={isIntroLoaded ? 0 : 10} />