chore(v2): update navbar logic (#1291)

v2/lib/load/config.js

@@ -30,6 +30,7 @@ const OPTIONAL_FIELDS = [
   'customDocsPath',
   'customFields',
   'defaultLanguage',
+  'disableHeaderTitle',
   'docsUrl',
   'githubHost',
   'highlight',

v2/lib/theme/Navbar/index.js

@@ -20,11 +20,19 @@ function Navbar(props) {
     metadata = {},
     docsMetadatas = {},
   } = context;
-  const {baseUrl, headerLinks, headerIcon, algolia} = siteConfig;
+  const {
+    baseUrl,
+    headerLinks,
+    headerIcon,
+    algolia,
+    title,
+    disableHeaderTitle,
+  } = siteConfig;
   const {language: thisLanguage, version: thisVersion} = metadata;
 
   const translationEnabled = env.translation.enabled;
   const versioningEnabled = env.versioning.enabled;
+  const defaultVersion = versioningEnabled && env.versioning.defaultVersion;
 
   // function to generate each header link
   const makeLinks = link => {
@@ -111,15 +119,31 @@ function Navbar(props) {
       <div className={styles.navbarInner}>
         <ul className={styles.navList}>
           <li key="logo" className={styles.navListItem}>
-            <Link className={styles.navBrand} to="/">
+            <Link
-              <img
+              className={styles.navBrand}
-                alt="Docusaurus Logo"
+              to={baseUrl + (translationEnabled ? thisLanguage : '')}>
-                className={styles.navLogo}
+              {headerIcon && (
-                src={baseUrl + headerIcon}
+                <img
-              />
+                  className={styles.navLogo}
-              <strong>Docusaurus</strong>
+                  src={baseUrl + headerIcon}
+                  alt={title}
+                />
+              )}
+              {!disableHeaderTitle && <strong>{title}</strong>}
             </Link>
           </li>
+          {versioningEnabled && (
+            <li key="versions" className={styles.navListItem}>
+              <Link
+                className={styles.navVersion}
+                to={
+                  baseUrl +
+                  (translationEnabled ? `${thisLanguage}/versions` : `versions`)
+                }>
+                {thisVersion || defaultVersion}
+              </Link>
+            </li>
+          )}
           {headerLinks.map(makeLinks)}
         </ul>
       </div>

v2/lib/theme/Navbar/styles.module.css

@@ -29,6 +29,13 @@
   text-decoration: none;
 }
 
+.navVersion {
+  color: black;
+  text-decoration: underline;
+  display: block;
+  padding: 1em 1.2em;
+}
+
 .navLogo {
   height: 40px;
   margin-right: 12px;