Merge branch 'header-footer' into 'dev'

Header footer

See merge request ligolang/ligo!105

gitlab-pages/.gitignore

@@ -1,4 +1,5 @@
 **/.DS_Store
+.DS_Store
 
 node_modules
 

gitlab-pages/website/core/Footer.js

@@ -24,57 +24,53 @@ class Footer extends React.Component {
   render() {
     return (
       <footer className="nav-footer" id="footer">
-        <section className="sitemap">
+        <section className="footer-wrapper">
-          <a className="nav-home"></a>
+          <div className="sitemap">
-          <div>
+            <a className="nav-home"></a>
-            <h5>Docs</h5>
+            <div>
-            <a href={this.docUrl('setup-installation.html', this.props.language)}>
+              <h5>Docs</h5>
-              Installation
+              <a href={this.docUrl('setup-installation.html', this.props.language)}>
-            </a>
+                Installation
-            <a href={this.docUrl('api-cli-commands.html', this.props.language)}>
+              </a>
-              CLI Commands
+              <a href={this.docUrl('api-cli-commands.html', this.props.language)}>
-            </a>
+                CLI Commands
-            <a href={this.docUrl('contributors/origin.html', this.props.language)}>
+              </a>
-              Contribute
+              <a href={this.docUrl('contributors/origin.html', this.props.language)}>
-            </a>
+                Contribute
-            <a href="/odoc">
+              </a>
-              Api Documentation
+              <a href="/odoc">
-            </a>
+                Api Documentation
+              </a>
+            </div>
+            <div>
+              <h5>Community</h5>
+              <a
+                href="https://tezos.stackexchange.com/questions/tagged/ligo"
+                target="_blank"
+                rel="noreferrer noopener">
+                Tezos Stack Exchange
+              </a>
+              <a
+                href="https://discord.gg/9rhYaEt"
+                target="_blank"
+                rel="noreferrer noopener">
+                Discord
+              </a>
+            </div>
+            <div>
+              <h5>More</h5>
+              <a href={`${this.props.config.baseUrl}blog`}>Blog</a>
+              <a href={this.docUrl('tutorials/get-started/tezos-taco-shop-smart-contract.html', this.props.language)}>Tutorials</a>
+              <a href={`${this.props.config.repoUrl}`}>Gitlab</a>
+            </div>
           </div>
-          <div>
+
-            <h5>Community</h5>
+          <div className="copyright">
-            <a
+            {this.props.config.copyright}
-              href="https://tezos.stackexchange.com/questions/tagged/ligo"
-              target="_blank"
-              rel="noreferrer noopener">
-              Tezos Stack Exchange
-            </a>
-            <a
-              href="https://discord.gg/9rhYaEt"
-              target="_blank"
-              rel="noreferrer noopener">
-              Discord
-            </a>
-          </div>
-          <div>
-            <h5>More</h5>
-            <a href={`${this.props.config.baseUrl}blog`}>Blog</a>
-            <a href={this.docUrl('tutorials/get-started/tezos-taco-shop-smart-contract.html', this.props.language)}>Tutorials</a>
-            <a href={`${this.props.config.repoUrl}`}>Gitlab</a>
           </div>
         </section>
       
         
-        <section className="copyright">
-          Website built with <a
-            href="https://docusaurus.io/"
-            target="_blank"
-            rel="noreferrer noopener">
-            Docusaurus
-          </a> by Facebook.
-          <div>Icons made by <a href="https://www.freepik.com/" title="Freepik">Freepik</a> & <a href="https://www.flaticon.com/authors/lucy-g" title="Lucy G">Lucy G</a> from <a href="https://www.flaticon.com/" 			    title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" 			    title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div>
-          {this.props.config.copyright}
-        </section>
       </footer>
     );
   }

gitlab-pages/website/siteConfig.js

@@ -14,7 +14,7 @@ const partners = [
     caption: "Nomadic Labs",
     // You will need to prepend the image path with your baseUrl
     // if it is not '/', like: '/test-site/img/image.jpg'.
-    image: "/img/nomadic-logo.svg",
+    image: "/img/nomadic-logo.jpg",
     infoLink: "https://www.nomadic-labs.com/",
     pinned: true
   },
@@ -22,7 +22,7 @@ const partners = [
     caption: "Tocqueville Group",
     // You will need to prepend the image path with your baseUrl
     // if it is not '/', like: '/test-site/img/image.jpg'.
-    image: "/img/tq-logo-2.svg",
+    image: "/img/tq-logo.svg",
     infoLink: "https://tqgroup.io/",
     pinned: true
   },
@@ -30,7 +30,7 @@ const partners = [
     caption: "Stove Labs",
     // You will need to prepend the image path with your baseUrl
     // if it is not '/', like: '/test-site/img/image.jpg'.
-    image: "/img/stove-logo.svg",
+    image: "/img/stove-logo.png",
     infoLink: "https://stove-labs.com",
     pinned: true
   }
@@ -82,8 +82,7 @@ const team = [
 const siteConfig = {
   title: "LIGO", // Title for your website.
   tagline:
-    "LIGO is a statically typed high-level smart-contract language that compiles down to Michelson.",
+    "LIGO is a statically typed high-level smart-contract language that compiles down to Michelson. It seeks to be easy to use, extensible and safe.",
-  taglineSub: "It seeks to be easy to use, extensible and safe.",
   url: "https://your-docusaurus-test-site.com", // Your website URL
   baseUrl: "/", // Base URL for your project */
   // For github.io type URLs, you would set the url and baseUrl like:
@@ -116,7 +115,6 @@ const siteConfig = {
   team,
 
   /* path to images for header/footer */
-  headerIcon: "img/logo.svg",
   footerIcon: "img/logo.svg",
   favicon: "img/logo.svg",
 
@@ -141,7 +139,7 @@ const siteConfig = {
   */
 
   // This copyright info is used in /core/Footer.js and blog RSS/Atom feeds.
-  copyright: `Copyright © ${new Date().getFullYear()} Marigold`,
+  copyright: `© ${new Date().getFullYear()} LIGO. All rights reserved.`,
 
   highlight: {
     // Highlight.js theme to use for syntax highlighting in code blocks.

gitlab-pages/website/static/css/custom.css

@@ -105,6 +105,36 @@ footnote {
   font-size: 0.75rem;
 }
 
+.projectTitle small {
+  max-width: 700px;
+  text-align: center;
+  margin: 0 auto;
+  margin-top: 0.7em;
+}
+
+.fixedHeaderContainer {
+  background-color: #ffffff;
+  color: var(--color-primary-text);
+}
+
+.fixedHeaderContainer a {
+  color: var(--color-primary-text);
+}
+
+.fixedHeaderContainer .headerWrapper header a:nth-child(2) {
+  background-color: #EFEFEF;
+  margin-left: 50px;
+  padding: 4px 7px;
+  font-weight: normal;
+}
+
+.fixedHeaderContainer .headerWrapper header h3 {
+  margin: 0;
+  color: var(--color-primary-text);
+  text-decoration: none;
+}
+
+
 .fixedHeaderContainer header .headerTitleWithLogo {
   display: none;
 }
@@ -113,8 +143,40 @@ footnote {
   background: var(--color-primary-text);
 }
 
+.nav-footer .copyright {
+  text-align: left;
+  margin-left: 92px;
+  margin-top: 3em;
+
+  border-top: 1px solid white;
+  padding-top: 3em;
+  margin-right: 92px;
+}
+
+.nav-footer .footer-wrapper {
+  margin: 0 auto 3em;
+  max-width: 1080px;
+}
+
+.nav-footer .sitemap {
+  margin: 0;
+}
+
 .navigationSlider .slidingNav {
-  background: #1a1a1a;
+  background: white;
+}
+
+.navigationSlider .slidingNav ul {
+  background: white;
+  color: var(--color-primary-text) !important;
+}
+
+.navigationSlider .slidingNav ul li > a:focus,
+.navigationSlider .slidingNav ul li > a:hover,
+.navigationSlider .slidingNav ul li.siteNavItemActive > a,
+.navigationSlider .slidingNav ul li.siteNavGroupActive > a {
+  background-color: white;
+  color: var(--color-primary-brand) !important;
 }
 
 /** Top Section **/
@@ -454,10 +516,39 @@ body
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  width: 20%;
+  max-width: fit-content;
+  color: var(--color-primary-text);
   padding: 0 var(--padding-level-1);
 }
 
+.profileContainer a {
+  color: var(--color-primary-text);
+}
+
+.profileContainer:hover {
+  color: var(--color-primary-brand);
+}
+
+.profileImage {
+  max-height: 195px;
+  max-width: 195px;
+  border: var(--color-gray);
+}
+.profileImage:hover {
+  box-shadow: 12px 12px 0px var(--color-primary-brand);
+}
+
+.team-container {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+  padding: var(--padding-level-1);
+  flex-wrap: wrap;
+}
+
+@media only screen and (min-device-width: 360px) and (max-device-width: 736px) {
+}
+
 .profileContainer p {
   color: var(--color-primary-text);
 }
@@ -499,10 +590,6 @@ body
   background-color: var(--color-light-gray);
 }
 
-.card:hover {
-  background-color: var(--color-light-blue);
-}
-
 .card-text {
   text-align: center;
 }
@@ -529,6 +616,16 @@ body
   border-left: 5px solid var(--color-primary-brand);
 }
 
+@media only screen and (min-width: 1024px) {
+  .navigationSlider .slidingNav ul li a {
+    color: #0D0F33;
+  }
+
+  .navigationSlider .slidingNav ul li a:hover {
+    color: #3AA0FF;
+  }
+}
+
 @media (min-width: 560px) and (max-width: 768px) {
   /** Special rules to reorient feature cards at only one screen size**/
   .card {
@@ -547,6 +644,10 @@ body
   .profileContainer {
     max-width: 30%;
   }
+
+  .headerWrapper header a:nth-child(2) {
+    display: none;
+  }
 }
 
 @media (max-width: 560px) {
@@ -563,7 +664,21 @@ body
   }
 }
 
+@media (max-width: 735px) {
+  .nav-footer .sitemap {
+    max-width: 90%;
+    margin: 0 auto;
+  }
+
+  .nav-footer .copyright {
+    max-width: 90%;
+    text-align: left;
+    margin: 3em auto;
+  }
+}
+
 @media only screen and (min-device-width: 360px) and (max-device-width: 736px) {
+
 }
 
 @media only screen and (max-width: 1023px) {
@@ -582,7 +697,10 @@ body
   }
 }
 
-@media only screen and (min-width: 1280px) {
+@media only screen and (max-width: 1023px) {
+  .reactNavSearchWrapper input#search_input_react {
+    background-color: rgba(0, 0, 0, 0.2);
+  }
 }
 
 @media only screen and (min-width: 1440px) {