misc: add announcement bar

website/docusaurus.config.js

@@ -8,6 +8,10 @@ module.exports = {
   organizationName: 'yangshun',
   projectName: 'tech-interview-handbook',
   themeConfig: {
+    announcementBar: {
+      id: 'announcement-1', // Increment on change
+      content: `⭐️ Bring your interview skills to the next level with Educative. <a href="https://www.educative.io/explore?search_string=interview&aff=x23W">Join today for a discount!</a> ⭐️`,
+    },
     prism: {
       theme: require('prism-react-renderer/themes/github'),
       darkTheme: require('prism-react-renderer/themes/dracula'),

website/src/css/custom.css

@@ -37,3 +37,9 @@ html[data-theme='dark'] {
     --ifm-h3-font-size: 1.25rem;
   }
 }
+
+div[class^='announcementBar_'] {
+  background-color: var(--ifm-color-primary);
+  color: #fff;
+  font-weight: bold;
+}