Merge pull request #1801 from entbit/new-header

[deploy_website] New header integration

Author: Urigo

website/docusaurus.config.js

@@ -10,6 +10,9 @@ module.exports = {
   projectName: 'graphql-cli',
 
   themeConfig: {
+    colorMode: {
+      disableSwitch: true,
+    },
     sidebarCollapsible: false,
     image: 'img/logo.png',
     navbar: {
@@ -98,12 +101,7 @@ module.exports = {
     },
   },
   scripts: [
-    '/js/light-mode-by-default.js',
-    {
-      src: 'https://the-guild.dev/static/banner.js',
-      async: true,
-      defer: true,
-    },
+    '/js/light-mode-by-default.js'
   ],
   presets: [
     [
@@ -121,7 +119,7 @@ module.exports = {
           customCss: require.resolve('./src/css/custom.css'),
         },
         sitemap: {
-          cacheTime: 600 * 1001, // 600 sec - cache purge period
+          // cacheTime: 600 * 1001, // 600 sec - cache purge period
           changefreq: 'weekly',
           priority: 0.5,
         },

website/package.json

@@ -13,7 +13,9 @@
     "@docusaurus/preset-classic": "^2.0.0-alpha",
     "clsx": "^1.1.1",
     "react": "^17.0.0",
-    "react-dom": "^17.0.0"
+    "react-dom": "^17.0.0",
+    "styled-components": "5.1.0",
+    "the-guild-components": "1.0.12"
   },
   "browserslist": {
     "production": [
@@ -27,4 +29,4 @@
       "last 1 safari version"
     ]
   }
-}
+}

website/src/theme/Root.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import BrowserOnly from '@docusaurus/BrowserOnly';
+import { ThemeProvider, Header } from 'the-guild-components';
+
+// Default implementation, that you can customize
+function Root({ children }) {
+  return (
+    <>
+      <BrowserOnly>
+        {() => (
+          <ThemeProvider>
+            <Header themeSwitch activeLink={'/open-source'} accentColor="var(--ifm-color-primary)" />
+          </ThemeProvider>
+        )}
+      </BrowserOnly>
+      {children}
+    </>
+  );
+}
+
+export default Root;