Format

docs/blog/2018-2-3-sites-with-headless-cms/index.md

@@ -28,7 +28,7 @@ When content exists in a tight relationship with the presentation layer, adaptin
 > 'delivers' content to an application of some type. Its immediate consumer is code, and it’s assumed that
 > code will reformat the content for final delivery to a human." - Deane Barker
 
-To add to [Deane Barker's eloquent explanation in the quote above](https://gadgetopia.com/post/9743), a headless CMS only handles two things--content and managing that content through admin screens. This means that a separate presentation layer (or “head”) like GatsbyJS must reformat the content for delivery to a CDN and then final delivery to humans. 
+To add to [Deane Barker's eloquent explanation in the quote above](https://gadgetopia.com/post/9743), a headless CMS only handles two things--content and managing that content through admin screens. This means that a separate presentation layer (or “head”) like GatsbyJS must reformat the content for delivery to a CDN and then final delivery to humans.
 
 There are advantages to this separation between headless CMSs and the presentation layer. Their separation allows both to become highly specialized and efficient, similar to the highly functioning microwave in the Jetson’s house:
 

docs/docs/adding-images-fonts-files.md

@@ -79,15 +79,17 @@ Examples:
 
   ```markdown
   ---
+
   title: "Title of article"
-attachments:
+  attachments:
+  ```
+
 - "./assets.zip"
-- "./presentation.pdf"
-  ---
+- ## "./presentation.pdf"
 
   Hi, this is a great article.
-  ```
 
+  ````
   In the article template component file, you can query for the attachments:
 
   ```graphql

docs/docs/custom-html.md

@@ -47,11 +47,11 @@ You can add custom JavaScript to your HTML document by using React's [dangerousl
 
 ```jsx
 <script
-    dangerouslySetInnerHTML={{
-        __html: `
+  dangerouslySetInnerHTML={{
+    __html: `
             var name = 'world';
             console.log('Hello ' + name);
-        `
-    }}
+        `,
+  }}
 />
 ```

docs/docs/gatsby-starters.md

@@ -418,7 +418,7 @@ Community:
   * A basic blog, with posts under src/pages/blog
   * A few basic components (Navigation, Layout, Link wrapper around `gatsby-link`))
   * Based on [gatsby-starter-gatsbytheme](https://github.com/saschajullmann/gatsby-starter-gatsbythemes)
-  
+
 * [gatsby-wordpress-starter](https://github.com/ericwindmill/gatsby-starter-wordpress)
   [(demo)](https://gatsby-wordpress-starter.netlify.com/)
 

examples/using-contentful/src/pages/image-api.js

@@ -69,7 +69,7 @@ export default props => {
         You should prefer this operator over <code>resize</code>.
       </p>
       {assets.map(({ node: { title, resolutions } }) => (
-        <div key={resolutions.src} style={{ display: "inline-block" }}>
+        <div key={resolutions.src} style={{ display: `inline-block` }}>
           <Img
             key={resolutions.src}
             alt={title}
@@ -79,7 +79,7 @@ export default props => {
               marginRight: rhythm(1 / 2),
               marginBottom: rhythm(1 / 2),
               border: `1px solid tomato`,
-              display: "inline-block",
+              display: `inline-block`,
             }}
           />
         </div>
@@ -126,7 +126,7 @@ export default props => {
         </a>
       </p>
       {assets.map(({ node: { title, resizing } }) => (
-        <div key={resizing.src} style={{ display: "inline-block" }}>
+        <div key={resizing.src} style={{ display: `inline-block` }}>
           <Img
             alt={title}
             resolutions={resizing}
@@ -209,22 +209,22 @@ export default props => {
       <h2>WebP Images</h2>
       <p>
         WebP is an image format that provides lossy and lossless compression
-        that may be better than JPEG or PNG. The <code>srcWebp</code> and{" "}
-        <code>srcSetWebp</code> fields are available for{" "}
+        that may be better than JPEG or PNG. The <code>srcWebp</code> and{` `}
+        <code>srcSetWebp</code> fields are available for{` `}
         <code>resolutions</code> and <code>sizes</code> queries.
       </p>
       <p>
-        WebP is currently only supported in{" "}
+        WebP is currently only supported in{` `}
         <a href="https://caniuse.com/#feat=webp">Chrome and Oprah browsers</a>,
         and you'll want to fall back to another format for other clients. When
-        this query is used with{" "}
+        this query is used with{` `}
         <a href="https://www.gatsbyjs.org/packages/gatsby-image/">
           <code>gatsby-image</code>
-        </a>{" "}
+        </a>{` `}
         WebP will be used automatically in browsers that support it.
       </p>
       {assets.map(({ node: { title, webp } }) => (
-        <div key={webp.src} style={{ display: "inline-block" }}>
+        <div key={webp.src} style={{ display: `inline-block` }}>
           <Img
             key={webp.src}
             alt={title}

packages/gatsby-plugin-less/README.md

@@ -12,8 +12,8 @@ Add the plugin to your `gatsby-config.js`.
 
 ```javascript
 module.exports = {
-  plugins: [`gatsby-plugin-less`]
-}
+  plugins: [`gatsby-plugin-less`],
+};
 ```
 
 By default this plugin will compile `*.less` and `*.module.less` files. The plugin can also be used with `modifyVars` as it is explained [here](http://lesscss.org/usage/). By defining a javascript object you can overwrite less-variables. This can be useful when using a component library like [antd](https://ant.design/docs/react/introduce).
@@ -29,7 +29,7 @@ module.exports = {
         },
       },
     },
-  ]
+  ],
 };
 ```
 
@@ -44,7 +44,7 @@ module.exports = {
         theme: `./src/theme.js`,
       },
     },
-  ]
+  ],
 };
 ```
 

packages/gatsby-source-filesystem/README.md

@@ -37,8 +37,8 @@ module.exports = {
         path: `${__dirname}/src/data/`,
       },
     },
-  ]
-}
+  ],
+};
 ```
 
 ## How to query

www/src/components/search-form.js

@@ -5,7 +5,7 @@ import { rhythm } from "../utils/typography"
 
 import presets, { colors } from "../utils/presets"
 import hex2rgba from "hex2rgba"
-import SearchIcon from './search-icon'
+import SearchIcon from "./search-icon"
 
 import { css } from "glamor"
 
@@ -348,7 +348,7 @@ class SearchForm extends Component {
                 width: !isHomepage && rhythm(5),
                 ":focus": {
                   backgroundColor: colors.ui.light,
-                  color:  colors.gatsby,
+                  color: colors.gatsby,
                 },
               },