From 2b4a76d2ea151af96d9d13bbf71d210c09709c60 Mon Sep 17 00:00:00 2001
From: justinschuldt <jschuldt@jumptrading.com>
Date: Tue, 23 Nov 2021 10:29:40 -0600
Subject: [PATCH] Explorer: documentaion links

Change-Id: If446a9422b7125e2f3ad0be75e26ba6669f4dd21

commit-id:91e9568c
---
 explorer/src/components/Layout/DefaultLayout.tsx |  9 +++++++++
 explorer/src/icons/Docs.svg                      | 14 ++++++++++++++
 explorer/src/locales/en.json                     |  4 +++-
 explorer/src/utils/misc/socials.tsx              |  3 +++
 4 files changed, 29 insertions(+), 1 deletion(-)
 create mode 100644 explorer/src/icons/Docs.svg

diff --git a/explorer/src/components/Layout/DefaultLayout.tsx b/explorer/src/components/Layout/DefaultLayout.tsx
index 9bb36535b..5f1c4a5a1 100644
--- a/explorer/src/components/Layout/DefaultLayout.tsx
+++ b/explorer/src/components/Layout/DefaultLayout.tsx
@@ -133,6 +133,15 @@ const DefaultLayout: React.FC<{}> = ({
         <FormattedMessage id="nav.explorerLink" />
       </Link>
     </div>,
+    <div key="docs" {...menuItemProps} >
+      <OutboundLink
+        href={"https://docs.wormholenetwork.com"}
+        target="_blank"
+        rel="noopener noreferrer"
+      >
+        {intl.formatMessage({ id: "nav.docsLink" })}
+      </OutboundLink>
+    </div>,
     <div key="jobs" {...menuItemProps} >
       <OutboundLink
         href={"https://boards.greenhouse.io/wormhole"}
diff --git a/explorer/src/icons/Docs.svg b/explorer/src/icons/Docs.svg
new file mode 100644
index 000000000..887a45c13
--- /dev/null
+++ b/explorer/src/icons/Docs.svg
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="459.319px" height="459.319px" viewBox="0 0 459.319 459.319" style="enable-background:new 0 0 459.319 459.319;"
+	 xml:space="preserve">
+	<path fill="#5A5A66" d="M94.924,366.674h312.874c0.958,0,1.886-0.136,2.778-0.349c0.071,0,0.13,0.012,0.201,0.012
+		c6.679,0,12.105-5.42,12.105-12.104V12.105C422.883,5.423,417.456,0,410.777,0h-2.955H114.284H94.941
+		c-32.22,0-58.428,26.214-58.428,58.425c0,0.432,0.085,0.842,0.127,1.259c-0.042,29.755-0.411,303.166-0.042,339.109
+		c-0.023,0.703-0.109,1.389-0.109,2.099c0,30.973,24.252,56.329,54.757,58.245c0.612,0.094,1.212,0.183,1.847,0.183h317.683
+		c6.679,0,12.105-5.42,12.105-12.105v-45.565c0-6.68-5.427-12.105-12.105-12.105s-12.105,5.426-12.105,12.105v33.461H94.924
+		c-18.395,0-33.411-14.605-34.149-32.817c0.018-0.325,0.077-0.632,0.071-0.963c-0.012-0.532-0.03-1.359-0.042-2.459
+		C61.862,380.948,76.739,366.674,94.924,366.674z M103.178,58.425c0-6.682,5.423-12.105,12.105-12.105s12.105,5.423,12.105,12.105
+		V304.31c0,6.679-5.423,12.105-12.105,12.105s-12.105-5.427-12.105-12.105V58.425z"/>
+</svg>
diff --git a/explorer/src/locales/en.json b/explorer/src/locales/en.json
index b50a9e152..b516bbf31 100644
--- a/explorer/src/locales/en.json
+++ b/explorer/src/locales/en.json
@@ -37,12 +37,14 @@
     "partnersLink": "partners",
     "codeLink": "code",
     "jobsLink": "jobs",
+    "docsLink": "docs",
     "bridgeLink": "Launch Bridge",
     "discordAltText": "Go to Wormhole's Discord",
     "githubAltText": "Go to Wormhole's Github",
     "mediumAltText": "Go to Wormhole's Medium",
     "telegramAltText": "Go to Wormhole's Telegram",
-    "twitterAltText": "Go to Wormhole's Twitter"
+    "twitterAltText": "Go to Wormhole's Twitter",
+    "docsAltText": "Go to Wormhole's Documentation"
   },
   "footer": {
     "openSource": "Open Source",
diff --git a/explorer/src/utils/misc/socials.tsx b/explorer/src/utils/misc/socials.tsx
index 9b858b35b..41d18c707 100644
--- a/explorer/src/utils/misc/socials.tsx
+++ b/explorer/src/utils/misc/socials.tsx
@@ -2,6 +2,7 @@ import React from 'react'
 
 import { IntlShape } from 'gatsby-plugin-intl';
 import { OutboundLink } from "gatsby-plugin-google-gtag"
+import { ReactComponent as DocsIcon } from '~/icons/Docs.svg';
 import { ReactComponent as DiscordIcon } from '~/icons/Discord.svg';
 import { ReactComponent as GithubIcon } from '~/icons/Github.svg';
 import { ReactComponent as MediumIcon } from '~/icons/Medium.svg';
@@ -11,6 +12,7 @@ import { ReactComponent as TwitterIcon } from '~/icons/Twitter.svg';
 interface KeyToElement { [service: string]: React.SFC<React.SVGProps<SVGSVGElement>> }
 
 const socialLinks: { [service: string]: string } = {
+    'docs': "https://docs.wormholenetwork.com",
     'discord': "https://discord.gg/xsT8qrHAvV",
     'github': "https://github.com/certusone/wormhole",
     'medium': "http://wormholecrypto.medium.com",
@@ -18,6 +20,7 @@ const socialLinks: { [service: string]: string } = {
     'twitter': "https://twitter.com/wormholecrypto",
 }
 const socialIcons: KeyToElement = {
+    'docs': DocsIcon,
     'discord': DiscordIcon,
     'github': GithubIcon,
     'medium': MediumIcon,