website: change nav links

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;
+}

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>
   );