prettier

Author: leebyron

src/Containers/Sections/Hero/index.tsx

@@ -1,74 +1,73 @@
-import { Link } from 'gatsby';
-import React from 'react';
-import HeaderLinks from '../../../components/HeaderLinks';
-import Search from '../../../components/Search';
-import Prism from '../../../components/Prism';
+import { Link } from "gatsby"
+import React from "react"
+import HeaderLinks from "../../../components/HeaderLinks"
+import Search from "../../../components/Search"
+import Prism from "../../../components/Prism"
 
-  
 const Hero = () => {
-    return (
-      <div className="hero">
-        <div className="abs">
-          <header aria-hidden>
-            <section>
-              <HeaderLinks />
-              <Search searchID="hero-search-input" />
-            </section>
-          </header>
-          <section className="intro">
-            <div className="named-logo">
-              <img src="/img/logo.svg" alt="GraphQL Logo" />
-              <h1>GraphQL</h1>
-            </div>
+  return (
+    <div className="hero">
+      <div className="abs">
+        <header aria-hidden>
+          <section>
+            <HeaderLinks />
+            <Search searchID="hero-search-input" />
+          </section>
+        </header>
+        <section className="intro">
+          <div className="named-logo">
+            <img src="/img/logo.svg" alt="GraphQL Logo" />
+            <h1>GraphQL</h1>
+          </div>
 
-            <div className="marketing-col">
-              <h3>Describe your data</h3>
-              <Prism
-                code={`type Project {
+          <div className="marketing-col">
+            <h3>Describe your data</h3>
+            <Prism
+              code={`type Project {
   name: String
   tagline: String
-  contributors: [User] 
+  contributors: [User]
 }`}
-                language={"graphql"}
-              />
-            </div>
+              language={"graphql"}
+            />
+          </div>
 
-            <div className="marketing-col">
-              <h3>Ask for what you want</h3>
-              <Prism
-                code={`{
+          <div className="marketing-col">
+            <h3>Ask for what you want</h3>
+            <Prism
+              code={`{
   project(name: "GraphQL") {
     tagline
   }
 }`}
-                language={"graphql"}
-              />
-            </div>
+              language={"graphql"}
+            />
+          </div>
 
-            <div className="marketing-col">
-              <h3>Get predictable results</h3>
-              <Prism
-                code={`{
+          <div className="marketing-col">
+            <h3>Get predictable results</h3>
+            <Prism
+              code={`{
   "project": {
     "tagline": "A query language for APIs"
   }
 }`}
-                language={"json"}
-              />
-            </div>
-          </section>
-
-          <div className="buttons-unit">
-            <Link className="button" to="/code/">
-              Get Started
-            </Link>
-            <Link className="button" to="/learn/">
-              Learn More
-            </Link>
+              language={"json"}
+            />
           </div>
+        </section>
+
+        <div className="buttons-unit">
+          <Link className="button" to="/code/">
+            Get Started
+          </Link>
+          <Link className="button" to="/learn/">
+            Learn More
+          </Link>
         </div>
       </div>
-    )
-};
+    </div>
+  )
+}
 
-export default Hero;
+export default Hero

src/assets/css/_css/variables.less

@@ -1,26 +1,26 @@
 /* https://www.pantone.com/color-finder/Rhodamine-Red-C */
-@dark-color: #171E26;
-@rhodamine-color: #E10098;
+@dark-color: #171e26;
+@rhodamine-color: #e10098;
 @text-color: #202020;
 
 .headline-font(@size: 48px, @color: @text-color) {
-  font-family: 'Rubik', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-family: "Rubik", "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-weight: 300;
   color: @color;
   font-size: @size;
   line-height: @size * 1.4;
 }
 
 .body-font(@size: 18px, @color: @text-color) {
-  font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-weight: 300;
   color: @color;
   font-size: @size;
   line-height: @size * 1.6;
 }
 
 .code-font(@size: 13px, @color: @text-color) {
-  font-family: 'Roboto Mono', Menlo, Monaco, monospace;
+  font-family: "Roboto Mono", Menlo, Monaco, monospace;
   font-weight: 400;
   color: @color;
   font-size: @size;

src/components/Header/index.tsx

@@ -17,7 +17,7 @@ const Header = () => {
           />
           GraphQL
         </Link>
-        <HeaderLinks/>
+        <HeaderLinks />
         <Search />
       </section>
     </header>