Prettify all the things

18 files changed, 62 insertions, 241 deletions

diff --git a/app/assets/javascripts/pipelines/components/blank_state.vue b/app/assets/javascripts/pipelines/components/blank_state.vue
index 34360105176..6c3a4a27606 100644
--- a/app/assets/javascripts/pipelines/components/blank_state.vue
+++ b/app/assets/javascripts/pipelines/components/blank_state.vue
@@ -18,9 +18,7 @@ export default {
 <template>
   <div class="row empty-state">
     <div class="col-12">
-      <div class="svg-content">
-        <img :src="svgPath" />
-      </div>
+      <div class="svg-content"><img :src="svgPath" /></div>
     </div>
 
     <div class="col-12 text-center">
diff --git a/app/assets/javascripts/pipelines/components/empty_state.vue b/app/assets/javascripts/pipelines/components/empty_state.vue
index f756c651684..d16f49f981c 100644
--- a/app/assets/javascripts/pipelines/components/empty_state.vue
+++ b/app/assets/javascripts/pipelines/components/empty_state.vue
@@ -25,44 +25,33 @@ export default {
 <template>
   <div class="row empty-state js-empty-state">
     <div class="col-12">
-      <div class="svg-content svg-250">
-        <img :src="emptyStateSvgPath" />
-      </div>
+      <div class="svg-content svg-250"><img :src="emptyStateSvgPath" /></div>
     </div>
 
     <div class="col-12">
       <div class="text-content">
-
         <template v-if="canSetCi">
-          <h4 class="text-center">
-            {{ s__('Pipelines|Build with confidence') }}
-          </h4>
+          <h4 class="text-center">{{ s__('Pipelines|Build with confidence') }}</h4>
 
           <p>
-            {{ s__(`Pipelines|Continuous Integration can help
+            {{
+              s__(`Pipelines|Continuous Integration can help
                 catch bugs by running your tests automatically,
                 while Continuous Deployment can help you deliver
-                code to your product environment.`) }}
+                code to your product environment.`)
+            }}
           </p>
 
           <div class="text-center">
-            <gl-button
-              :href="helpPagePath"
-              variant="primary"
-              class="js-get-started-pipelines"
-            >
+            <gl-button :href="helpPagePath" variant="primary" class="js-get-started-pipelines">
               {{ s__('Pipelines|Get started with Pipelines') }}
             </gl-button>
           </div>
         </template>
 
-        <p
-          v-else
-          class="text-center"
-        >
+        <p v-else class="text-center">
           {{ s__('Pipelines|This project is not currently set up to run pipelines.') }}
         </p>
-
       </div>
     </div>
   </div>
diff --git a/app/assets/javascripts/pipelines/components/graph/action_component.vue b/app/assets/javascripts/pipelines/components/graph/action_component.vue
index 3a39dfe181d..8ca539351a7 100644
--- a/app/assets/javascripts/pipelines/components/graph/action_component.vue
+++ b/app/assets/javascripts/pipelines/components/graph/action_component.vue
@@ -86,6 +86,6 @@ export default {
 btn-transparent ci-action-icon-container ci-action-icon-wrapper"
     @click="onClickAction"
   >
-    <icon :name="actionIcon"/>
+    <icon :name="actionIcon" />
   </gl-button>
 </template>
diff --git a/app/assets/javascripts/pipelines/components/graph/graph_component.vue b/app/assets/javascripts/pipelines/components/graph/graph_component.vue
index 6c9a11c3829..6f008528db4 100644
--- a/app/assets/javascripts/pipelines/components/graph/graph_component.vue
+++ b/app/assets/javascripts/pipelines/components/graph/graph_component.vue
@@ -58,16 +58,9 @@ export default {
 <template>
   <div class="build-content middle-block js-pipeline-graph">
     <div class="pipeline-visualization pipeline-graph pipeline-tab-content">
-      <div class="text-center">
-        <gl-loading-icon
-          v-if="isLoading"
-          :size="3"
-        />
-      </div>
+      <div class="text-center"><gl-loading-icon v-if="isLoading" :size="3" /></div>
 
-      <ul
-        v-if="!isLoading"
-        class="stage-column-list">
+      <ul v-if="!isLoading" class="stage-column-list">
         <stage-column-component
           v-for="(stage, index) in graph"
           :key="stage.name"
diff --git a/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue b/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue
index 2670ea29db6..482898b80c4 100644
--- a/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue
+++ b/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue
@@ -69,22 +69,15 @@ export default {
     >
       <ci-icon :status="group.status" />
 
-      <span class="ci-status-text">
-        {{ group.name }}
-      </span>
+      <span class="ci-status-text"> {{ group.name }} </span>
 
-      <span class="dropdown-counter-badge">
-        {{ group.size }}
-      </span>
+      <span class="dropdown-counter-badge"> {{ group.size }} </span>
     </button>
 
     <ul class="dropdown-menu big-pipeline-graph-dropdown-menu js-grouped-pipeline-dropdown">
       <li class="scrollable-menu">
         <ul>
-          <li
-            v-for="job in group.jobs"
-            :key="job.id"
-          >
+          <li v-for="job in group.jobs" :key="job.id">
             <job-item
               :dropdown-length="group.size"
               :job="job"
diff --git a/app/assets/javascripts/pipelines/components/graph/job_item.vue b/app/assets/javascripts/pipelines/components/graph/job_item.vue
index e6abf32decc..782494f72e4 100644
--- a/app/assets/javascripts/pipelines/components/graph/job_item.vue
+++ b/app/assets/javascripts/pipelines/components/graph/job_item.vue
@@ -114,10 +114,7 @@ export default {
       :class="cssClassJobName"
       class="js-pipeline-graph-job-link"
     >
-      <job-name-component
-        :name="job.name"
-        :status="job.status"
-      />
+      <job-name-component :name="job.name" :status="job.status" />
     </gl-link>
 
     <div
@@ -127,11 +124,7 @@ export default {
       :class="cssClassJobName"
       class="js-job-component-tooltip non-details-job-component"
     >
-
-      <job-name-component
-        :name="job.name"
-        :status="job.status"
-      />
+      <job-name-component :name="job.name" :status="job.status" />
     </div>
 
     <action-component
diff --git a/app/assets/javascripts/pipelines/components/graph/job_name_component.vue b/app/assets/javascripts/pipelines/components/graph/job_name_component.vue
index 6fdbcc1e049..1bfab2a7fc0 100644
--- a/app/assets/javascripts/pipelines/components/graph/job_name_component.vue
+++ b/app/assets/javascripts/pipelines/components/graph/job_name_component.vue
@@ -28,8 +28,6 @@ export default {
   <span class="ci-job-name-component">
     <ci-icon :status="status" />
 
-    <span class="ci-status-text">
-      {{ name }}
-    </span>
+    <span class="ci-status-text"> {{ name }} </span>
   </span>
 </template>
diff --git a/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue b/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue
index d5f931943d5..09a50d25020 100644
--- a/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue
+++ b/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue
@@ -42,13 +42,8 @@ export default {
 };
 </script>
 <template>
-  <li
-    :class="stageConnectorClass"
-    class="stage-column"
-  >
-    <div class="stage-name">
-      {{ title }}
-    </div>
+  <li :class="stageConnectorClass" class="stage-column">
+    <div class="stage-name">{{ title }}</div>
     <div class="builds-container">
       <ul>
         <li
@@ -58,7 +53,6 @@ export default {
           :class="buildConnnectorClass(index)"
           class="build"
         >
-
           <div class="curve"></div>
 
           <job-item
diff --git a/app/assets/javascripts/pipelines/components/header_component.vue b/app/assets/javascripts/pipelines/components/header_component.vue
index ac7fa4b195e..b2e365e5cde 100644
--- a/app/assets/javascripts/pipelines/components/header_component.vue
+++ b/app/assets/javascripts/pipelines/components/header_component.vue
@@ -89,10 +89,6 @@ export default {
       item-name="Pipeline"
       @actionClicked="postAction"
     />
-    <gl-loading-icon
-      v-if="isLoading"
-      :size="2"
-      class="prepend-top-default append-bottom-default"
-    />
+    <gl-loading-icon v-if="isLoading" :size="2" class="prepend-top-default append-bottom-default" />
   </div>
 </template>
diff --git a/app/assets/javascripts/pipelines/components/nav_controls.vue b/app/assets/javascripts/pipelines/components/nav_controls.vue
index 5104fe36b42..c6990683ec7 100644
--- a/app/assets/javascripts/pipelines/components/nav_controls.vue
+++ b/app/assets/javascripts/pipelines/components/nav_controls.vue
@@ -60,11 +60,7 @@ export default {
       @click="onClickResetCache"
     />
 
-    <gl-button
-      v-if="ciLintPath"
-      :href="ciLintPath"
-      class="js-ci-lint"
-    >
+    <gl-button v-if="ciLintPath" :href="ciLintPath" class="js-ci-lint">
       {{ s__('Pipelines|CI Lint') }}
     </gl-button>
   </div>
diff --git a/app/assets/javascripts/pipelines/components/pipeline_url.vue b/app/assets/javascripts/pipelines/components/pipeline_url.vue
index 249f7b9f368..e5924d3a77e 100644
--- a/app/assets/javascripts/pipelines/components/pipeline_url.vue
+++ b/app/assets/javascripts/pipelines/components/pipeline_url.vue
@@ -48,10 +48,7 @@ export default {
 </script>
 <template>
   <div class="table-section section-15 d-none d-sm-none d-md-block pipeline-tags">
-    <gl-link
-      :href="pipeline.path"
-      class="js-pipeline-url-link"
-    >
+    <gl-link :href="pipeline.path" class="js-pipeline-url-link">
       <span class="pipeline-id">#{{ pipeline.id }}</span>
     </gl-link>
     <span>by</span>
@@ -62,11 +59,7 @@ export default {
       :tooltip-text="pipeline.user.name"
       class="js-pipeline-url-user"
     />
-    <span
-      v-if="!user"
-      class="js-pipeline-url-api api">
-      API
-    </span>
+    <span v-if="!user" class="js-pipeline-url-api api"> API </span>
     <div class="label-container">
       <span
         v-if="pipeline.flags.latest"
@@ -101,10 +94,7 @@ export default {
       >
         Auto DevOps
       </gl-link>
-      <span
-        v-if="pipeline.flags.stuck"
-        class="js-pipeline-url-stuck badge badge-warning"
-      >
+      <span v-if="pipeline.flags.stuck" class="js-pipeline-url-stuck badge badge-warning">
         stuck
       </span>
     </div>
diff --git a/app/assets/javascripts/pipelines/components/pipelines.vue b/app/assets/javascripts/pipelines/components/pipelines.vue
index fcd8a54c9c1..9dcea557b32 100644
--- a/app/assets/javascripts/pipelines/components/pipelines.vue
+++ b/app/assets/javascripts/pipelines/components/pipelines.vue
@@ -247,20 +247,8 @@ export default {
       v-if="shouldRenderTabs || shouldRenderButtons"
       class="top-area scrolling-tabs-container inner-page-scroll-tabs"
     >
-      <div class="fade-left">
-        <i
-          class="fa fa-angle-left"
-          aria-hidden="true"
-        >
-        </i>
-      </div>
-      <div class="fade-right">
-        <i
-          class="fa fa-angle-right"
-          aria-hidden="true"
-        >
-        </i>
-      </div>
+      <div class="fade-left"><i class="fa fa-angle-left" aria-hidden="true"> </i></div>
+      <div class="fade-right"><i class="fa fa-angle-right" aria-hidden="true"> </i></div>
 
       <navigation-tabs
         v-if="shouldRenderTabs"
@@ -280,7 +268,6 @@ export default {
     </div>
 
     <div class="content-list pipelines">
-
       <gl-loading-icon
         v-if="stateToRender === $options.stateMap.loading"
         :label="s__('Pipelines|Loading Pipelines')"
@@ -298,8 +285,10 @@ export default {
       <svg-blank-state
         v-else-if="stateToRender === $options.stateMap.error"
         :svg-path="errorStateSvgPath"
-        :message="s__(`Pipelines|There was an error fetching the pipelines.
-        Try again in a few moments or contact your support team.`)"
+        :message="
+          s__(`Pipelines|There was an error fetching the pipelines.
+        Try again in a few moments or contact your support team.`)
+        "
       />
 
       <svg-blank-state
@@ -308,11 +297,7 @@ export default {
         :message="emptyTabMessage"
       />
 
-      <div
-        v-else-if="stateToRender === $options.stateMap.tableList"
-        class="table-holder"
-      >
-
+      <div v-else-if="stateToRender === $options.stateMap.tableList" class="table-holder">
         <pipelines-table-component
           :pipelines="state.pipelines"
           :update-graph-dropdown="updateGraphDropdown"
diff --git a/app/assets/javascripts/pipelines/components/pipelines_actions.vue b/app/assets/javascripts/pipelines/components/pipelines_actions.vue
index 112c1559f25..2e9f2519fcb 100644
--- a/app/assets/javascripts/pipelines/components/pipelines_actions.vue
+++ b/app/assets/javascripts/pipelines/components/pipelines_actions.vue
@@ -67,33 +67,20 @@ export default {
       data-toggle="dropdown"
       aria-label="Manual job"
     >
-      <icon
-        name="play"
-        class="icon-play"
-      />
-      <i
-        class="fa fa-caret-down"
-        aria-hidden="true">
-      </i>
+      <icon name="play" class="icon-play" /> <i class="fa fa-caret-down" aria-hidden="true"> </i>
       <gl-loading-icon v-if="isLoading" />
     </gl-button>
 
     <ul class="dropdown-menu dropdown-menu-right">
-      <li
-        v-for="action in actions"
-        :key="action.path"
-      >
+      <li v-for="action in actions" :key="action.path">
         <gl-button
           :class="{ disabled: isActionDisabled(action) }"
           :disabled="isActionDisabled(action)"
           class="js-pipeline-action-link no-btn btn"
-          @click="onClickAction(action)"
+          @click="onClickAction(action);"
         >
           {{ action.name }}
-          <span
-            v-if="action.scheduled_at"
-            class="pull-right"
-          >
+          <span v-if="action.scheduled_at" class="pull-right">
             <icon name="clock" />
             <gl-countdown :end-date-string="action.scheduled_at" />
           </span>
diff --git a/app/assets/javascripts/pipelines/components/pipelines_artifacts.vue b/app/assets/javascripts/pipelines/components/pipelines_artifacts.vue
index d7d9eb00faa..908b10afee6 100644
--- a/app/assets/javascripts/pipelines/components/pipelines_artifacts.vue
+++ b/app/assets/javascripts/pipelines/components/pipelines_artifacts.vue
@@ -20,10 +20,7 @@ export default {
 };
 </script>
 <template>
-  <div
-    class="btn-group"
-    role="group"
-  >
+  <div class="btn-group" role="group">
     <gl-button
       v-gl-tooltip
       class="dropdown-toggle build-artifacts js-pipeline-dropdown-download"
@@ -31,23 +28,11 @@ export default {
       data-toggle="dropdown"
       aria-label="Artifacts"
     >
-      <icon name="download" />
-      <i
-        class="fa fa-caret-down"
-        aria-hidden="true"
-      >
-      </i>
+      <icon name="download" /> <i class="fa fa-caret-down" aria-hidden="true"> </i>
     </gl-button>
     <ul class="dropdown-menu dropdown-menu-right">
-      <li
-        v-for="(artifact, i) in artifacts"
-        :key="i"
-      >
-        <gl-link
-          :href="artifact.path"
-          rel="nofollow"
-          download
-        >
+      <li v-for="(artifact, i) in artifacts" :key="i">
+        <gl-link :href="artifact.path" rel="nofollow" download>
           Download {{ artifact.name }} artifacts
         </gl-link>
       </li>
diff --git a/app/assets/javascripts/pipelines/components/pipelines_table.vue b/app/assets/javascripts/pipelines/components/pipelines_table.vue
index 3339b5c13ed..1c60ae6a152 100644
--- a/app/assets/javascripts/pipelines/components/pipelines_table.vue
+++ b/app/assets/javascripts/pipelines/components/pipelines_table.vue
@@ -80,32 +80,17 @@ export default {
 </script>
 <template>
   <div class="ci-table">
-    <div
-      class="gl-responsive-table-row table-row-header"
-      role="row"
-    >
-      <div
-        class="table-section section-10 js-pipeline-status pipeline-status"
-        role="rowheader"
-      >
+    <div class="gl-responsive-table-row table-row-header" role="row">
+      <div class="table-section section-10 js-pipeline-status pipeline-status" role="rowheader">
         {{ s__('Pipeline|Status') }}
       </div>
-      <div
-        class="table-section section-15 js-pipeline-info pipeline-info"
-        role="rowheader"
-      >
+      <div class="table-section section-15 js-pipeline-info pipeline-info" role="rowheader">
         {{ s__('Pipeline|Pipeline') }}
       </div>
-      <div
-        class="table-section section-20 js-pipeline-commit pipeline-commit"
-        role="rowheader"
-      >
+      <div class="table-section section-20 js-pipeline-commit pipeline-commit" role="rowheader">
         {{ s__('Pipeline|Commit') }}
       </div>
-      <div
-        class="table-section section-20 js-pipeline-stages pipeline-stages"
-        role="rowheader"
-      >
+      <div class="table-section section-20 js-pipeline-stages pipeline-stages" role="rowheader">
         {{ s__('Pipeline|Stages') }}
       </div>
     </div>
@@ -128,6 +113,5 @@ export default {
     >
       <span v-html="modalText"></span>
     </modal>
-
   </div>
 </template>
diff --git a/app/assets/javascripts/pipelines/components/pipelines_table_row.vue b/app/assets/javascripts/pipelines/components/pipelines_table_row.vue
index fd674a8d447..da42698c255 100644
--- a/app/assets/javascripts/pipelines/components/pipelines_table_row.vue
+++ b/app/assets/javascripts/pipelines/components/pipelines_table_row.vue
@@ -257,32 +257,16 @@ export default {
 <template>
   <div class="commit gl-responsive-table-row">
     <div class="table-section section-10 commit-link">
-      <div
-        class="table-mobile-header"
-        role="rowheader"
-      >
-        {{ s__('Pipeline|Status') }}
-      </div>
+      <div class="table-mobile-header" role="rowheader">{{ s__('Pipeline|Status') }}</div>
       <div class="table-mobile-content">
-        <ci-badge
-          :status="pipelineStatus"
-          :show-text="!isChildView"
-        />
+        <ci-badge :status="pipelineStatus" :show-text="!isChildView" />
       </div>
     </div>
 
-    <pipeline-url
-      :pipeline="pipeline"
-      :auto-devops-help-path="autoDevopsHelpPath"
-    />
+    <pipeline-url :pipeline="pipeline" :auto-devops-help-path="autoDevopsHelpPath" />
 
     <div class="table-section section-20">
-      <div
-        class="table-mobile-header"
-        role="rowheader"
-      >
-        {{ s__('Pipeline|Commit') }}
-      </div>
+      <div class="table-mobile-header" role="rowheader">{{ s__('Pipeline|Commit') }}</div>
       <div class="table-mobile-content">
         <commit-component
           :tag="commitTag"
@@ -297,12 +281,7 @@ export default {
     </div>
 
     <div class="table-section section-wrap section-20 stage-cell">
-      <div
-        class="table-mobile-header"
-        role="rowheader"
-      >
-        {{ s__('Pipeline|Stages') }}
-      </div>
+      <div class="table-mobile-header" role="rowheader">{{ s__('Pipeline|Stages') }}</div>
       <div class="table-mobile-content">
         <template v-if="pipeline.details.stages.length > 0">
           <div
@@ -320,20 +299,14 @@ export default {
       </div>
     </div>
 
-    <pipelines-timeago
-      :duration="pipelineDuration"
-      :finished-time="pipelineFinishedAt"
-    />
+    <pipelines-timeago :duration="pipelineDuration" :finished-time="pipelineFinishedAt" />
 
     <div
       v-if="displayPipelineActions"
       class="table-section section-20 table-button-footer pipeline-actions"
     >
       <div class="btn-group table-action-buttons">
-        <pipelines-actions-component
-          v-if="actions.length > 0"
-          :actions="actions"
-        />
+        <pipelines-actions-component v-if="actions.length > 0" :actions="actions" />
 
         <pipelines-artifacts-component
           v-if="pipeline.details.artifacts.length"
diff --git a/app/assets/javascripts/pipelines/components/stage.vue b/app/assets/javascripts/pipelines/components/stage.vue
index 1d62472671a..2d3f667e73e 100644
--- a/app/assets/javascripts/pipelines/components/stage.vue
+++ b/app/assets/javascripts/pipelines/components/stage.vue
@@ -169,35 +169,20 @@ export default {
       aria-expanded="false"
       @click="onClickStage"
     >
-
-      <span
-        :aria-label="stage.title"
-        aria-hidden="true"
-        class="no-pointer-events"
-      >
+      <span :aria-label="stage.title" aria-hidden="true" class="no-pointer-events">
         <icon :name="borderlessIcon" />
       </span>
 
-      <i
-        class="fa fa-caret-down"
-        aria-hidden="true"
-      >
-      </i>
+      <i class="fa fa-caret-down" aria-hidden="true"> </i>
     </button>
 
     <div
       class="dropdown-menu mini-pipeline-graph-dropdown-menu js-builds-dropdown-container"
       aria-labelledby="stageDropdown"
     >
-      <gl-loading-icon v-if="isLoading"/>
-      <ul
-        v-else
-        class="js-builds-dropdown-list scrollable-menu"
-      >
-        <li
-          v-for="job in dropdownContent"
-          :key="job.id"
-        >
+      <gl-loading-icon v-if="isLoading" />
+      <ul v-else class="js-builds-dropdown-list scrollable-menu">
+        <li v-for="job in dropdownContent" :key="job.id">
           <job-item
             :dropdown-length="dropdownContent.length"
             :job="job"
diff --git a/app/assets/javascripts/pipelines/components/time_ago.vue b/app/assets/javascripts/pipelines/components/time_ago.vue
index bed690200b8..2ed0c24825c 100644
--- a/app/assets/javascripts/pipelines/components/time_ago.vue
+++ b/app/assets/javascripts/pipelines/components/time_ago.vue
@@ -56,32 +56,14 @@ export default {
 </script>
 <template>
   <div class="table-section section-15 pipelines-time-ago">
-    <div
-      class="table-mobile-header"
-      role="rowheader"
-    >
-      {{ s__('Pipeline|Duration') }}
-    </div>
+    <div class="table-mobile-header" role="rowheader">{{ s__('Pipeline|Duration') }}</div>
     <div class="table-mobile-content">
-      <p
-        v-if="hasDuration"
-        class="duration"
-      >
-        <span v-html="iconTimerSvg">
-        </span>
-        {{ durationFormated }}
+      <p v-if="hasDuration" class="duration">
+        <span v-html="iconTimerSvg"> </span> {{ durationFormated }}
       </p>
 
-      <p
-        v-if="hasFinishedTime"
-        class="finished-at d-none d-sm-none d-md-block"
-      >
-
-        <i
-          class="fa fa-calendar"
-          aria-hidden="true"
-        >
-        </i>
+      <p v-if="hasFinishedTime" class="finished-at d-none d-sm-none d-md-block">
+        <i class="fa fa-calendar" aria-hidden="true"> </i>
 
         <time
           v-tooltip