Merge branch 'ee-40468-empty-states' into 'master'

Update empty state for service desk

See merge request gitlab-org/gitlab-ee!3710

ee/app/assets/stylesheets/pages/service_desk.scss

 .service-desk-issues {
-  .empty-state {
-    max-width: 450px;
-    text-align: center;
-  }
-
   .non-empty-state {
     text-align: left;
     padding-bottom: $gl-padding-top;
     border-bottom: 1px solid $border-color;
-
-    .service-desk-graphic {
-      margin-top: $gl-padding;
-    }
-
-    .media-body {
-      margin-top: $gl-padding-top;
-      margin-left: $gl-padding;
-    }
-  }
-
-  .turn-on-btn-container {
-    margin-top: $gl-padding-top;
   }
 }

ee/app/views/projects/issues/_service_desk_info_content.html.haml

@@ -4,22 +4,26 @@
 - callout_selector = is_empty_state ? 'empty-state' : 'non-empty-state media'
 - svg_path = !is_empty_state ? 'shared/empty_states/icons/service_desk_callout.svg' : 'shared/empty_states/icons/service_desk_empty_state.svg'
 - can_edit_project_settings = can?(current_user, :admin_project, @project)
+- title_text = _("Use Service Desk to connect with your users (e.g. to offer customer support) through email right inside GitLab")
 
 %div{ class: "#{callout_selector}" }
-  .service-desk-graphic
+  .svg-content
     = render svg_path
 
-  .media-body
-    %h5 Use Service Desk to connect with your users (e.g. to offer customer support) through email right inside GitLab.
+  %div{ class: is_empty_state ? "text-content" : "prepend-top-10 prepend-left-default" }
+    - if is_empty_state
+      %h4= title_text
+    - else
+      %h5= title_text
 
     - if service_desk_enabled
       %p
-        Have your users email
+        = _("Have your users email")
         %code= @project.service_desk_address
 
-    %span Those emails automatically become issues (with the comments becoming the email conversation) listed here.
-    = link_to 'Read more', help_page_path('user/project/service_desk')
+    %span= _("Those emails automatically become issues (with the comments becoming the email conversation) listed here.")
+    = link_to _('Read more'), help_page_path('user/project/service_desk')
 
     - if can_edit_project_settings && !service_desk_enabled
-      .turn-on-btn-container
-        = link_to "Turn on Service Desk", edit_project_path(@project), class: 'btn btn-new btn-inverted'
+      %div{ class: is_empty_state ? "text-center" : "prepend-top-10" }
+        = link_to _("Turn on Service Desk"), edit_project_path(@project), class: 'btn btn-success'