Merge branch 'master' into scheduled-manual-jobs-environment-play-buttons

Conflicts:
	spec/javascripts/environments/environment_actions_spec.js

5 files changed, 83 insertions, 88 deletions

diff --git a/app/assets/javascripts/environments/components/container.vue b/app/assets/javascripts/environments/components/container.vue
index 9de851c9409..00d197d294f 100644
--- a/app/assets/javascripts/environments/components/container.vue
+++ b/app/assets/javascripts/environments/components/container.vue
@@ -1,40 +1,40 @@
 <script>
-  import tablePagination from '../../vue_shared/components/table_pagination.vue';
-  import environmentTable from '../components/environments_table.vue';
+import tablePagination from '../../vue_shared/components/table_pagination.vue';
+import environmentTable from '../components/environments_table.vue';
 
-  export default {
-    components: {
-      environmentTable,
-      tablePagination,
+export default {
+  components: {
+    environmentTable,
+    tablePagination,
+  },
+  props: {
+    isLoading: {
+      type: Boolean,
+      required: true,
     },
-    props: {
-      isLoading: {
-        type: Boolean,
-        required: true,
-      },
-      environments: {
-        type: Array,
-        required: true,
-      },
-      pagination: {
-        type: Object,
-        required: true,
-      },
-      canCreateDeployment: {
-        type: Boolean,
-        required: true,
-      },
-      canReadEnvironment: {
-        type: Boolean,
-        required: true,
-      },
+    environments: {
+      type: Array,
+      required: true,
     },
-    methods: {
-      onChangePage(page) {
-        this.$emit('onChangePage', page);
-      },
+    pagination: {
+      type: Object,
+      required: true,
     },
-  };
+    canCreateDeployment: {
+      type: Boolean,
+      required: true,
+    },
+    canReadEnvironment: {
+      type: Boolean,
+      required: true,
+    },
+  },
+  methods: {
+    onChangePage(page) {
+      this.$emit('onChangePage', page);
+    },
+  },
+};
 </script>
 
 <template>
diff --git a/app/assets/javascripts/environments/components/empty_state.vue b/app/assets/javascripts/environments/components/empty_state.vue
index cf78f89981e..2360a52645b 100644
--- a/app/assets/javascripts/environments/components/empty_state.vue
+++ b/app/assets/javascripts/environments/components/empty_state.vue
@@ -1,44 +1,45 @@
 <script>
-  export default {
-    name: 'EnvironmentsEmptyState',
-    props: {
-      newPath: {
-        type: String,
-        required: true,
-      },
-      canCreateEnvironment: {
-        type: Boolean,
-        required: true,
-      },
-      helpPath: {
-        type: String,
-        required: true,
-      },
+export default {
+  name: 'EnvironmentsEmptyState',
+  props: {
+    newPath: {
+      type: String,
+      required: true,
     },
-  };
+    canCreateEnvironment: {
+      type: Boolean,
+      required: true,
+    },
+    helpPath: {
+      type: String,
+      required: true,
+    },
+  },
+};
 </script>
 <template>
-  <div class="blank-state-row">
-    <div class="blank-state-center">
-      <h2 class="blank-state-title js-blank-state-title">
-        {{ s__("Environments|You don't have any environments right now.") }}
-      </h2>
+  <div class="empty-state">
+    <div class="text-content">
+      <h4 class="blank-state-title js-blank-state-title">
+        {{ s__("Environments|You don't have any environments right now") }}
+      </h4>
       <p class="blank-state-text">
         {{ s__(`Environments|Environments are places where
-code gets deployed, such as staging or production.`) }}
-        <br />
+        code gets deployed, such as staging or production.`) }}
         <a :href="helpPath">
           {{ s__("Environments|Read more about environments") }}
         </a>
       </p>
 
-      <a
-        v-if="canCreateEnvironment"
-        :href="newPath"
-        class="btn btn-success js-new-environment-button"
-      >
-        {{ s__("Environments|New environment") }}
-      </a>
+      <div class="text-center">
+        <a
+          v-if="canCreateEnvironment"
+          :href="newPath"
+          class="btn btn-success js-new-environment-button"
+        >
+          {{ s__("Environments|New environment") }}
+        </a>
+      </div>
     </div>
   </div>
 </template>
diff --git a/app/assets/javascripts/environments/components/environment_actions.vue b/app/assets/javascripts/environments/components/environment_actions.vue
index 7ee2bb61007..2d51a13d8a0 100644
--- a/app/assets/javascripts/environments/components/environment_actions.vue
+++ b/app/assets/javascripts/environments/components/environment_actions.vue
@@ -81,11 +81,9 @@ export default {
     >
       <span>
         <icon name="play" />
-        <i
-          class="fa fa-caret-down"
-          aria-hidden="true"
-        >
-        </i>
+        <icon
+          name="chevron-down"
+        />
         <gl-loading-icon v-if="isLoading" />
       </span>
     </button>
diff --git a/app/assets/javascripts/environments/components/environment_item.vue b/app/assets/javascripts/environments/components/environment_item.vue
index c16931521a7..f2fb0074ea1 100644
--- a/app/assets/javascripts/environments/components/environment_item.vue
+++ b/app/assets/javascripts/environments/components/environment_item.vue
@@ -4,6 +4,7 @@ import _ from 'underscore';
 import tooltip from '~/vue_shared/directives/tooltip';
 import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link.vue';
 import { humanize } from '~/lib/utils/text_utility';
+import Icon from '~/vue_shared/components/icon.vue';
 import ActionsComponent from './environment_actions.vue';
 import ExternalUrlComponent from './environment_external_url.vue';
 import StopComponent from './environment_stop.vue';
@@ -25,6 +26,7 @@ export default {
   components: {
     UserAvatarLink,
     CommitComponent,
+    Icon,
     ActionsComponent,
     ExternalUrlComponent,
     StopComponent,
@@ -435,6 +437,10 @@ export default {
         this.canRetry
       );
     },
+
+    folderIconName() {
+      return this.model.isOpen ? 'chevron-down' : 'chevron-right';
+    },
   },
 
   methods: {
@@ -481,27 +487,15 @@ export default {
         role="button"
         @click="onClickFolder">
 
-        <span class="folder-icon">
-          <i
-            v-show="model.isOpen"
-            class="fa fa-caret-down"
-            aria-hidden="true"
-          >
-          </i>
-          <i
-            v-show="!model.isOpen"
-            class="fa fa-caret-right"
-            aria-hidden="true"
-          >
-          </i>
-        </span>
+        <icon
+          :name="folderIconName"
+          class="folder-icon"
+        />
 
-        <span class="folder-icon">
-          <i
-            class="fa fa-folder"
-            aria-hidden="true">
-          </i>
-        </span>
+        <icon
+          name="folder"
+          class="folder-icon"
+        />
 
         <span>
           {{ model.folderName }}
diff --git a/app/assets/javascripts/environments/components/environment_rollback.vue b/app/assets/javascripts/environments/components/environment_rollback.vue
index efbf88d0f11..9e137f79dcc 100644
--- a/app/assets/javascripts/environments/components/environment_rollback.vue
+++ b/app/assets/javascripts/environments/components/environment_rollback.vue
@@ -38,7 +38,9 @@ export default {
 
   computed: {
     title() {
-      return this.isLastDeployment ? s__('Environments|Re-deploy to environment') : s__('Environments|Rollback environment');
+      return this.isLastDeployment
+        ? s__('Environments|Re-deploy to environment')
+        : s__('Environments|Rollback environment');
     },
   },