From c983f9f9ca169e7e30729f65bebe9e611dd69288 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Se=CC=81rgio=20Ramos?= <mail@sergioramos.me>
Date: Thu, 16 Nov 2017 11:58:56 +0000
Subject: [PATCH] style: prettify

---
 CONTRIBUTING.md                               |  28 ++--
 README.md                                     |  54 +++----
 packages/ui-toolkit/src/button/index.js       |   1 -
 .../ui-toolkit/src/form/input-dropdown.js     |   2 +-
 .../ui-toolkit/src/layout/view-container.js   |  38 -----
 packages/ui-toolkit/src/text/headings.js      |   1 -
 .../src/components/affinity/index.js          | 153 +++++++++---------
 .../src/components/filters/filters.js         |  34 ++--
 .../src/components/home/home.js               |  12 +-
 9 files changed, 146 insertions(+), 177 deletions(-)

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 4520f1e9..3f2f40b8 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -8,7 +8,7 @@ delivery (CD as known from now on in this document).
 We will define CD in this document as a method of developing a feature per
 commit with an encapsulating test that proves that the functionality is working,
 the contributor will test their code locally and if all is passing will push to
-*master*.
+_master_.
 
 For contributors that do not have write access, follow the same conventions but
 open a Pull Request instead.
@@ -23,8 +23,8 @@ In this scenario, the contributor should open a pull request instead.
 
 ## Commit messages
 
-Follow [Git blessed](http://chris.beams.io/posts/git-commit/) and [Conventional
-Commits](https://conventionalcommits.org)
+Follow [Git blessed](http://chris.beams.io/posts/git-commit/) and
+[Conventional Commits](https://conventionalcommits.org)
 
 1. Separate subject from body with a blank line
 1. Limit the subject line to 50 characters
@@ -36,14 +36,14 @@ Commits](https://conventionalcommits.org)
 
 Types:
 
-- build
-- chore
-- ci
-- docs
-- feat
-- fix
-- perf
-- refactor
-- revert
-- style
-- test
+* build
+* chore
+* ci
+* docs
+* feat
+* fix
+* perf
+* refactor
+* revert
+* style
+* test
diff --git a/README.md b/README.md
index ad8270b8..70edfc36 100644
--- a/README.md
+++ b/README.md
@@ -4,57 +4,57 @@
 
 ## Table of Contents
 
-- [Requirements](#requirements)
-- [Links](#links)
-- [Related](#related)
-- [Contribute](#contribute)
-- [License](#license)
+* [Requirements](#requirements)
+* [Links](#links)
+* [Related](#related)
+* [Contribute](#contribute)
+* [License](#license)
 
 ## Requirements
 
-- [Triton account](https://sso.joyent.com/signup)
-- [Triton CLI](https://www.npmjs.com/package/triton)
-- [Docker](https://www.docker.com/)
+* [Triton account](https://sso.joyent.com/signup)
+* [Triton CLI](https://www.npmjs.com/package/triton)
+* [Docker](https://www.docker.com/)
 
 ## Links
 
-- [Joyent Ui Toolkit](https://joyent-ui-toolkit.now.sh/)
-- [Create Instance Prototype](https://create-instance-prototype.now.sh)
+* [Joyent Ui Toolkit](https://joyent-ui-toolkit.now.sh/)
+* [Create Instance Prototype](https://create-instance-prototype.now.sh)
 
 ## Related
 
-- [cloudapi-gql](https://github.com/yldio/cloudapi-gql)
+* [cloudapi-gql](https://github.com/yldio/cloudapi-gql)
 
 #### CoPilot
 
-- [copilot](https://github.com/yldio/copilot)
-- [docker-compose-api](https://github.com/yldio/docker-compose-api)
+* [copilot](https://github.com/yldio/copilot)
+* [docker-compose-api](https://github.com/yldio/docker-compose-api)
 
 #### styled-components
 
-- [normalized-styled-components](https://github.com/yldio/normalized-styled-components)
-- [styled-is](https://github.com/yldio/styled-is)
+* [normalized-styled-components](https://github.com/yldio/normalized-styled-components)
+* [styled-is](https://github.com/yldio/styled-is)
 
 #### Utilities
 
-- [pseudo-yaml-ast](https://github.com/yldio/pseudo-yaml-ast)
-- [pseudo-json-ast](https://github.com/yldio/pseudo-json-ast)
-- [unitcalc](https://github.com/yldio/unitcalc)
-- [remcalc](https://github.com/yldio/remcalc)
-- [rnd-id](https://github.com/yldio/rnd-id)
+* [pseudo-yaml-ast](https://github.com/yldio/pseudo-yaml-ast)
+* [pseudo-json-ast](https://github.com/yldio/pseudo-json-ast)
+* [unitcalc](https://github.com/yldio/unitcalc)
+* [remcalc](https://github.com/yldio/remcalc)
+* [rnd-id](https://github.com/yldio/rnd-id)
 
 #### Tooling
 
-- [stylelint-config-joyent-portal](https://github.com/yldio/stylelint-config-joyent-portal)
-- [joyent-react-scripts](https://github.com/yldio/joyent-react-scripts)
-- [babel-preset-joyent-portal](https://github.com/yldio/babel-preset-joyent-portal)
-- [eslint-config-joyent-portal](https://github.com/yldio/eslint-config-joyent-portal)
+* [stylelint-config-joyent-portal](https://github.com/yldio/stylelint-config-joyent-portal)
+* [joyent-react-scripts](https://github.com/yldio/joyent-react-scripts)
+* [babel-preset-joyent-portal](https://github.com/yldio/babel-preset-joyent-portal)
+* [eslint-config-joyent-portal](https://github.com/yldio/eslint-config-joyent-portal)
 
 #### Components
 
-- [react-topology](https://github.com/yldio/react-topology)
-- [metrics](https://github.com/yldio/metrics-yall)
-- [joyent-manifest-editor](https://github.com/yldio/joyent-manifest-editor)
+* [react-topology](https://github.com/yldio/react-topology)
+* [metrics](https://github.com/yldio/metrics-yall)
+* [joyent-manifest-editor](https://github.com/yldio/joyent-manifest-editor)
 
 ## Contribute
 
diff --git a/packages/ui-toolkit/src/button/index.js b/packages/ui-toolkit/src/button/index.js
index 212e81a6..54368412 100644
--- a/packages/ui-toolkit/src/button/index.js
+++ b/packages/ui-toolkit/src/button/index.js
@@ -172,7 +172,6 @@ const style = css`
     margin: 0;
   `};
 
-
   ${is('bold')`
     font-weight: bold;
   `};
diff --git a/packages/ui-toolkit/src/form/input-dropdown.js b/packages/ui-toolkit/src/form/input-dropdown.js
index 6738ec67..5fc5a4d3 100644
--- a/packages/ui-toolkit/src/form/input-dropdown.js
+++ b/packages/ui-toolkit/src/form/input-dropdown.js
@@ -10,4 +10,4 @@ const InputDropdown = styled.div`
   margin-top: ${remcalc(8)};
 `;
 
-export default InputDropdown;;
+export default InputDropdown;
diff --git a/packages/ui-toolkit/src/layout/view-container.js b/packages/ui-toolkit/src/layout/view-container.js
index 7373baa9..49c02b55 100644
--- a/packages/ui-toolkit/src/layout/view-container.js
+++ b/packages/ui-toolkit/src/layout/view-container.js
@@ -1,43 +1,9 @@
-import styled, { css } from 'styled-components';
 import { Grid } from 'react-styled-flexboxgrid';
 import remcalc from 'remcalc';
 import is, { isNot } from 'styled-is';
 
 import { styled as breakpoints } from '../breakpoints';
 
-const Base = css`
-  margin-right: auto;
-  margin-left: auto;
-
-  ${is('fluid')`
-    width: 100%;
-    padding-left: 0;
-    padding-right: 0;
-  `};
-
-  ${isNot('fluid')`
-    max-width: ${remcalc(1000)};
-
-    ${breakpoints.smallOnly`
-      padding-left: ${remcalc(6)};
-      padding-right: ${remcalc(6)};
-    `};
-  `};
-
-  ${is('main')`
-    padding-bottom: ${remcalc(18)};
-  `};
-
-  ${is('center')`
-    display: flex;
-    flex-direction: column;
-    flex-wrap: nowrap;
-    justify-content: center;
-    align-content: center;
-    align-items: center;
-  `};
-`;
-
 export default Grid.extend`
   ${is('fluid')`
     width: 100%;
@@ -67,7 +33,3 @@ export default Grid.extend`
     align-items: center;
   `};
 `;
-//
-//
-// const View
-//
diff --git a/packages/ui-toolkit/src/text/headings.js b/packages/ui-toolkit/src/text/headings.js
index 8aa8af7a..177edec5 100644
--- a/packages/ui-toolkit/src/text/headings.js
+++ b/packages/ui-toolkit/src/text/headings.js
@@ -94,7 +94,6 @@ export const H4 = styled.h4`
   }
 `;
 
-
 export const H5 = styled.h4`
   margin: 0;
   ${typography.color};
diff --git a/prototypes/create-instance-icons/src/components/affinity/index.js b/prototypes/create-instance-icons/src/components/affinity/index.js
index 4a53db4e..3e535961 100644
--- a/prototypes/create-instance-icons/src/components/affinity/index.js
+++ b/prototypes/create-instance-icons/src/components/affinity/index.js
@@ -104,7 +104,7 @@ class Affinity extends Component {
         <P>
           Affinity rules control the location of instances, to help reduce
           traffic across networks and keep the workload balanced. With strict
-          rules, instances are only provisioned when the criteria is met. {' '}
+          rules, instances are only provisioned when the criteria is met.{' '}
           <a href="https://apidocs.joyent.com/docker/features/placement ">
             Read the docs
           </a>
@@ -122,82 +122,85 @@ class Affinity extends Component {
     </ViewContainer>,
     <Row>
       <Col xs={12}>
-      {this.state.showRuleCreation ? (
-        <Margin top={2}>
-          <Card shadow>
-            <CardHeader secondary={false} transparent={false}>
-              <CardHeaderMeta>
-                <Row between="xs" middle="xs">
-                  <Col xs={12}>
-                    <H4>Create an affinity rule</H4>
-                  </Col>
-                </Row>
-              </CardHeaderMeta>
-            </CardHeader>
-            <CardOutlet>
-              <div>
-                <H4>The instance</H4>
-              </div>
-              <div>
-                <Select fluid onChange={this.instanceChange}>
-                  <option>must</option>
-                  <option>should</option>
-                </Select>
-              </div>
-              <div>
-                <H4>be on</H4>
-              </div>
-              <div>
-                <Select fluid onChange={this.beChange}>
-                  <option>the same</option>
-                  <option>a different</option>
-                </Select>
-              </div>
-              <div>
-                <H4>node as the instance(s) identified by the</H4>
-              </div>
-              <div>
-                <MarginInline right={1}>
-                  <Select fluid onChange={this.typeChange}>
-                    <option>instance name</option>
-                    <option>tag name</option>
+        {this.state.showRuleCreation ? (
+          <Margin top={2}>
+            <Card shadow>
+              <CardHeader secondary={false} transparent={false}>
+                <CardHeaderMeta>
+                  <Row between="xs" middle="xs">
+                    <Col xs={12}>
+                      <H4>Create an affinity rule</H4>
+                    </Col>
+                  </Row>
+                </CardHeaderMeta>
+              </CardHeader>
+              <CardOutlet>
+                <div>
+                  <H4>The instance</H4>
+                </div>
+                <div>
+                  <Select fluid onChange={this.instanceChange}>
+                    <option>must</option>
+                    <option>should</option>
                   </Select>
-                </MarginInline>
-                <MarginInline right={1}>
-                  <Select fluid onChange={this.typeChange}>
-                    <option>equalling</option>
-                    <option>not equalling</option>
-                    <option>containing</option>
-                    <option>starting with</option>
-                    <option>ending with</option>
+                </div>
+                <div>
+                  <H4>be on</H4>
+                </div>
+                <div>
+                  <Select fluid onChange={this.beChange}>
+                    <option>the same</option>
+                    <option>a different</option>
                   </Select>
-                </MarginInline>
-                <Input
-                  type="text"
-                  onChange={this.valueChange}
-                  required
-                  value={this.state.rule.value}
-                  placeholder="Example instance name: nginx"
-                />
-              </div>
-              <div>
-                <Button secondary onClick={this.toggleForm}>
-                  Cancel
-                </Button>
-                <Button onClick={this.submit} disabled={!this.state.rule.value}>
-                  Create
-                </Button>
-              </div>
-            </CardOutlet>
-          </Card>
-        </Margin>
-      ) : (
-        <Margin top={2}>
-          <Button secondary bold onClick={this.toggleForm}>
-            Create affinity rule
-          </Button>
-        </Margin>
-      )}
+                </div>
+                <div>
+                  <H4>node as the instance(s) identified by the</H4>
+                </div>
+                <div>
+                  <MarginInline right={1}>
+                    <Select fluid onChange={this.typeChange}>
+                      <option>instance name</option>
+                      <option>tag name</option>
+                    </Select>
+                  </MarginInline>
+                  <MarginInline right={1}>
+                    <Select fluid onChange={this.typeChange}>
+                      <option>equalling</option>
+                      <option>not equalling</option>
+                      <option>containing</option>
+                      <option>starting with</option>
+                      <option>ending with</option>
+                    </Select>
+                  </MarginInline>
+                  <Input
+                    type="text"
+                    onChange={this.valueChange}
+                    required
+                    value={this.state.rule.value}
+                    placeholder="Example instance name: nginx"
+                  />
+                </div>
+                <div>
+                  <Button secondary onClick={this.toggleForm}>
+                    Cancel
+                  </Button>
+                  <Button
+                    onClick={this.submit}
+                    disabled={!this.state.rule.value}
+                  >
+                    Create
+                  </Button>
+                </div>
+              </CardOutlet>
+            </Card>
+          </Margin>
+        ) : (
+          <Margin top={2}>
+            <Button secondary bold onClick={this.toggleForm}>
+              Create affinity rule
+            </Button>
+          </Margin>
+        )}
       </Col>
     </Row>
   ];
diff --git a/prototypes/create-instance-icons/src/components/filters/filters.js b/prototypes/create-instance-icons/src/components/filters/filters.js
index 4b552727..f000cc13 100644
--- a/prototypes/create-instance-icons/src/components/filters/filters.js
+++ b/prototypes/create-instance-icons/src/components/filters/filters.js
@@ -70,23 +70,23 @@ class Filters extends Component {
     } = this.props;
 
     return [
-        <Row>
-          <Col xs={8}>
-            <Margin bottom={6}>
-              <H2>Package</H2>
-            </Margin>
-          </Col>
-        </Row>,
-        <RowMargin>
-          <Col xs={8}>
-            <P>
-              A package defines the specs of your instance. On Triton, packages
-              can only increase in size.{' '}
-              <a href="https://docs.joyent.com/public-cloud/instances/packages/sizing">
-                Read the docs
-              </a>
-            </P>
-          </Col>
+      <Row>
+        <Col xs={8}>
+          <Margin bottom={6}>
+            <H2>Package</H2>
+          </Margin>
+        </Col>
+      </Row>,
+      <RowMargin>
+        <Col xs={8}>
+          <P>
+            A package defines the specs of your instance. On Triton, packages
+            can only increase in size.{' '}
+            <a href="https://docs.joyent.com/public-cloud/instances/packages/sizing">
+              Read the docs
+            </a>
+          </P>
+        </Col>
       </RowMargin>,
       <Row>
         <Col>
diff --git a/prototypes/create-instance-icons/src/components/home/home.js b/prototypes/create-instance-icons/src/components/home/home.js
index da443a07..715500a5 100644
--- a/prototypes/create-instance-icons/src/components/home/home.js
+++ b/prototypes/create-instance-icons/src/components/home/home.js
@@ -76,8 +76,12 @@ class Home extends Component {
     ));
 
     return [
-      <Row><Col xs={12}>{breadcrumbLinks}</Col></Row>,
-      <Row><Col xs={12}>{_msg}</Col></Row>,
+      <Row>
+        <Col xs={12}>{breadcrumbLinks}</Col>
+      </Row>,
+      <Row>
+        <Col xs={12}>{_msg}</Col>
+      </Row>,
       <Margin vertical={2}>
         <Divider height="1px" />
       </Margin>,
@@ -98,7 +102,9 @@ class Home extends Component {
         <PackagesHOC />
       </Margin>,
       <Row end="xs">
-        <Col xs={12}><Button>Next</Button></Col>
+        <Col xs={12}>
+          <Button>Next</Button>
+        </Col>
       </Row>,
       <Margin top={2}>
         <AffinityHOC />