From b4bb08d8ee35e14c858aee6115593e9e8ffa404e Mon Sep 17 00:00:00 2001
From: Yangshun <tay.yang.shun@gmail.com>
Date: Tue, 16 May 2023 18:39:05 +0800
Subject: [PATCH] website: change nav links

---
 apps/website/docusaurus.config.js             | 22 ++++---------------
 apps/website/src/css/custom.css               | 16 +++++++++++++-
 .../src/theme/DocItem/Content/index.js        | 12 ++++++++++
 3 files changed, 31 insertions(+), 19 deletions(-)

diff --git a/apps/website/docusaurus.config.js b/apps/website/docusaurus.config.js
index f4c558b4..cf7f27f2 100755
--- a/apps/website/docusaurus.config.js
+++ b/apps/website/docusaurus.config.js
@@ -9,7 +9,7 @@ module.exports = {
   projectName: 'tech-interview-handbook',
   themeConfig: {
     announcementBar: {
-       id: 'algomonster-1', // Increment on change
+      id: 'algomonster-1', // Increment on change
       content: `Stop grinding mindlessly, study with a plan! Developed by Google engineers,
       <a href="https://shareasale.com/r.cfm?b=1873647&u=3114753&m=114505&urllink=&afftrack=" target="_blank" rel="noopener">AlgoMonster</a> is the fastest way to get a software engineering job.
       <a href="https://shareasale.com/r.cfm?b=1873647&u=3114753&m=114505&urllink=&afftrack=" target="_blank" rel="noopener">Check it out now!</a>`,
@@ -68,25 +68,11 @@ module.exports = {
             </svg>`,
         },
         {
-          href: 'https://discord.gg/usMqNaPczq',
+          href: 'https://linkedin.com/in/yangshun',
           position: 'right',
           className: 'navbar-icon',
-          'aria-label': 'Discord channel',
-          html: `<svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 640 512" height="24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M524.531,69.836a1.5,1.5,0,0,0-.764-.7A485.065,485.065,0,0,0,404.081,32.03a1.816,1.816,0,0,0-1.923.91,337.461,337.461,0,0,0-14.9,30.6,447.848,447.848,0,0,0-134.426,0,309.541,309.541,0,0,0-15.135-30.6,1.89,1.89,0,0,0-1.924-.91A483.689,483.689,0,0,0,116.085,69.137a1.712,1.712,0,0,0-.788.676C39.068,183.651,18.186,294.69,28.43,404.354a2.016,2.016,0,0,0,.765,1.375A487.666,487.666,0,0,0,176.02,479.918a1.9,1.9,0,0,0,2.063-.676A348.2,348.2,0,0,0,208.12,430.4a1.86,1.86,0,0,0-1.019-2.588,321.173,321.173,0,0,1-45.868-21.853,1.885,1.885,0,0,1-.185-3.126c3.082-2.309,6.166-4.711,9.109-7.137a1.819,1.819,0,0,1,1.9-.256c96.229,43.917,200.41,43.917,295.5,0a1.812,1.812,0,0,1,1.924.233c2.944,2.426,6.027,4.851,9.132,7.16a1.884,1.884,0,0,1-.162,3.126,301.407,301.407,0,0,1-45.89,21.83,1.875,1.875,0,0,0-1,2.611,391.055,391.055,0,0,0,30.014,48.815,1.864,1.864,0,0,0,2.063.7A486.048,486.048,0,0,0,610.7,405.729a1.882,1.882,0,0,0,.765-1.352C623.729,277.594,590.933,167.465,524.531,69.836ZM222.491,337.58c-28.972,0-52.844-26.587-52.844-59.239S193.056,219.1,222.491,219.1c29.665,0,53.306,26.82,52.843,59.239C275.334,310.993,251.924,337.58,222.491,337.58Zm195.38,0c-28.971,0-52.843-26.587-52.843-59.239S388.437,219.1,417.871,219.1c29.667,0,53.307,26.82,52.844,59.239C470.715,310.993,447.538,337.58,417.871,337.58Z"></path></svg>`,
-        },
-        {
-          href: 'https://t.me/techinterviewhandbook',
-          position: 'right',
-          className: 'navbar-icon navbar-icon-telegram',
-          'aria-label': 'Telegram channel',
-          html: `<svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 448 512" height="24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M446.7 98.6l-67.6 318.8c-5.1 22.5-18.4 28.1-37.3 17.5l-103-75.9-49.7 47.8c-5.5 5.5-10.1 10.1-20.7 10.1l7.4-104.9 190.9-172.5c8.3-7.4-1.8-11.5-12.9-4.1L117.8 284 16.2 252.2c-22.1-6.9-22.5-22.1 4.6-32.7L418.2 66.4c18.4-6.9 34.5 4.1 28.5 32.2z"></path></svg>`,
-        },
-        {
-          href: 'https://twitter.com/techinterviewhb',
-          position: 'right',
-          className: 'navbar-icon navbar-icon-twitter',
-          'aria-label': 'Twitter page',
-          html: `<svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" height="24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"></path></svg>`,
+          'aria-label': 'LinkedIn',
+          html: `<svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 16 16" height="20" width="20" xmlns="http://www.w3.org/2000/svg"><path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4z"></path></svg>`,
         },
       ],
     },
diff --git a/apps/website/src/css/custom.css b/apps/website/src/css/custom.css
index 4dc50518..8ea53f77 100755
--- a/apps/website/src/css/custom.css
+++ b/apps/website/src/css/custom.css
@@ -136,7 +136,7 @@ div[class^='announcementBar_'] {
 
 .theme-doc-markdown details {
   --ifm-alert-background-color: transparent;
-  border: 1px solid var(--ifm-color-primary);
+  border: 1px solid var(--ifm-color-emphasis-800);
 }
 
 .theme-doc-markdown details h2,
@@ -171,3 +171,17 @@ div[class^='announcementBar_'] {
 .admonition-heading h5 {
   margin-top: 0;
 }
+
+.shoutout {
+  background-color: var(--ifm-color-primary);
+  border-radius: 0.5rem;
+  color: #fff;
+  display: block;
+  font-size: 14px;
+  padding: 0.75rem;
+}
+
+.shoutout:hover {
+  text-decoration: none;
+  color: #fff;
+}
diff --git a/apps/website/src/theme/DocItem/Content/index.js b/apps/website/src/theme/DocItem/Content/index.js
index aca69a80..fa263f89 100644
--- a/apps/website/src/theme/DocItem/Content/index.js
+++ b/apps/website/src/theme/DocItem/Content/index.js
@@ -4,6 +4,7 @@ import { ThemeClassNames } from '@docusaurus/theme-common';
 import { useDoc } from '@docusaurus/theme-common/internal';
 import Heading from '@theme/Heading';
 import MDXContent from '@theme/MDXContent';
+
 /**
  Title can be declared inside md content or declared through
  front matter and added manually. To make both cases consistent,
@@ -41,6 +42,17 @@ export default function DocItemContent({ children }) {
           title="GitHub Stars"
         />
       </div>
+      <div className="margin-bottom--lg">
+        <a
+          className="shoutout"
+          href="https://www.linkedin.com/in/yangshun"
+          target="_blank"
+        >
+          👋 Hi there, I'm Yangshun, an ex-Meta Staff Engineer, author of this
+          handbook and Blind 75. Follow me on <u>LinkedIn</u> for Software
+          Engineering advice and interview tips!
+        </a>
+      </div>
       <MDXContent>{children}</MDXContent>
     </div>
   );