tweak website design

Author: satya164

docs/api-reference.md

@@ -9,10 +9,10 @@
     "rename-version": "docusaurus-rename-version",
     "crowdin-upload": "crowdin --config ../crowdin.yaml upload sources --auto-update -b source",
     "crowdin-download": "crowdin --config ../crowdin.yaml download -b source",
-     "postinstall": "patch-package"
+    "postinstall": "patch-package"
   },
   "devDependencies": {
-    "docusaurus": "^1.12.0",
+    "docusaurus": "^1.14.0",
     "localtunnel": "^2.0.0"
   },
   "dependencies": {

website/package.json

@@ -43,8 +43,8 @@ class HomeSplash extends React.Component {
             <div className="inner">
               <h2 className="projectTitle">
                 {siteConfig.title}
-                <small>{siteConfig.tagline}</small>
               </h2>
+              <p>{siteConfig.tagline}</p>
 
               <div className="section promoSection">
                 <div className="promoRow">
@@ -95,7 +95,7 @@ class Index extends React.Component {
     return (
       <div>
         <HomeSplash language={language} />
-        <div className="mainContainer">
+        <div className="heroContainer">
           <Container padding={['bottom', 'top']}>
             <GridBlock
               align="center"

website/pages/en/index.js

@@ -42,7 +42,6 @@
       "upgrading-from-4.x"
     ],
     "API Reference": [
-      "api-reference",
       "navigation-prop",
       "navigation-context",
       {

website/sidebars.json

@@ -16,7 +16,6 @@ const siteConfig = {
   projectName: 'react-navigation.github.io',
   headerLinks: [
     { doc: 'getting-started', label: 'Docs' },
-    { doc: 'api-reference', label: 'API' },
     { page: 'help', label: 'Help' },
     { blog: true, label: 'Blog' },
   ],
@@ -41,7 +40,7 @@ const siteConfig = {
     'https://github.com/react-navigation/react-navigation.github.io/edit/source/docs/',
 
   gaTrackingId: 'UA-10128745-16',
-  docsSideNavCollapsible: false,
+  docsSideNavCollapsible: true,
   algolia: {
     apiKey: 'c967b4a1491b9cb486d3dca087b771e6',
     indexName: 'reactnavigation',

website/siteConfig.js

@@ -4,34 +4,6 @@
 }
 
 @media only screen and (min-width: 1024px) {
-  .mainContainer {
-    background: #f9f9f9;
-    padding: 0;
-  }
-
-  .docMainWrapper .mainContainer {
-    padding: 30px 0 !important;
-  }
-
-  .toc {
-    padding: 30px 0 !important;
-  }
-
-  .toc .toggleNav ul {
-    padding: 0 !important;
-  }
-
-  .onPageNav {
-    top: 70px;
-  }
-
-  .container.paddingTop {
-    padding-top: 70px;
-  }
-
-  .container.paddingBottom {
-    padding-bottom: 70px;
-  }
 }
 
 @media only screen and (max-width: 1023px) {
@@ -44,17 +16,27 @@
 }
 
 body {
+  background: #fff;
+}
+
+blockquote {
+  background-color: rgba(226, 232, 125, 0.2);
+  border-left: 5px solid rgba(226, 232, 125, 0.5);
+}
+
+pre code {
+  background-color: #f9f9f9 !important;
+  border-left: 4px solid #6b52ae;
+}
+
+.heroContainer {
   background: #f9f9f9;
 }
 
 .homeContainer {
   background: #fff;
 }
 
-h2 {
-  font-weight: normal;
-}
-
 .pluginRowBlock .button {
   margin-left: 3px;
   margin-right: 3px;
@@ -66,20 +48,8 @@ h2 {
   color: #6b52ae;
 }
 
-h2 p {
+.headerTitleWithLogo {
   font-weight: 500;
-  color: rgba(0, 0, 0, 0.7);
-}
-
-article h1 {
-  margin-top: 25px;
-  margin-bottom: 25px;
-  font-weight: normal;
-  text-decoration: underline;
-}
-
-article h2 {
-  margin-top: 16px;
 }
 
 .projectTitle {
@@ -91,25 +61,11 @@ article h2 {
   margin-top: 0.4em;
 }
 
-h1.postHeaderTitle {
-}
-
-blockquote {
-  background-color: rgba(226, 232, 125, 0.1);
-  border-left: 5px solid rgba(226, 232, 125, 0.3);
-}
-
 .run-code-button {
   margin-top: -25px;
   margin-bottom: 5px;
   display: inline-block;
 }
-
-pre code {
-  background-color: #fff;
-  border-left: 4px solid #6b52ae;
-}
-
 .navWrapper li {
   word-wrap: normal;
 }
@@ -135,4 +91,4 @@ samp {
 
 code.template {
   display: none;
-}
+}