Polish jira_connect users UI

- Fix nav bar not rendering theme properly.
- Add avatar to user link.
- Adjust headings, margins and spacing of elements.
- Update margin between text and icon in external_link
helper.

Changelog: changed

app/assets/stylesheets/page_bundles/jira_connect_users.scss

-@import 'mixins_and_variables_and_functions';
-
-.jira-connect-users-container {
-  margin-left: auto;
-  margin-right: auto;
-  width: px-to-rem(350px);
-}
-
-.devise-layout-html body .navless-container {
-  @include media-breakpoint-down(xs) {
-    padding-top: 65px;
-  }
-}
+@import '../themes/theme_indigo';

app/helpers/external_link_helper.rb

@@ -5,7 +5,7 @@ module ExternalLinkHelper
 
   def external_link(body, url, options = {})
     link = link_to url, { target: '_blank', rel: 'noopener noreferrer' }.merge(options) do
-      "#{body}#{sprite_icon('external-link', css_class: 'gl-ml-1')}".html_safe
+      "#{body}#{sprite_icon('external-link', css_class: 'gl-ml-2')}".html_safe
     end
     sanitize(link, tags: %w(a svg use), attributes: %w(target rel data-testid class href).concat(options.stringify_keys.keys))
   end

app/views/jira_connect/users/show.html.haml

-.jira-connect-users-container.gl-text-center
-  - user_link = link_to(current_user.to_reference, user_path(current_user), target: '_blank', rel: 'noopener noreferrer')
-  %h2= _('You are signed in to GitLab as %{user_link}').html_safe % { user_link: user_link }
+.gl-text-center.gl-mx-auto.gl-pt-6
+  %h3.gl-mb-4
+    = _('You are signed in to GitLab as:')
 
-  %p= s_('Integrations|You can now close this window and return to the GitLab for Jira application.')
+  .gl-display-flex.gl-flex-direction-column.gl-align-items-center.gl-mb-4
+    = link_to user_path(current_user), target: '_blank', rel: 'noopener noreferrer' do
+      = user_avatar_without_link(user: current_user, size: 60, css_class: 'gl-mr-0! gl-mb-2', has_tooltip: false)
+    = link_to current_user.to_reference, user_path(current_user), target: '_blank', rel: 'noopener noreferrer'
+
+  %p.gl-mb-6
+    = s_('JiraService|You can now close this window and%{br}return to the GitLab for Jira application.').html_safe % { br: '<br>'.html_safe }
 
   - if @jira_app_link
     %p= external_link s_('Integrations|Return to GitLab for Jira'), @jira_app_link, class: 'gl-button btn btn-confirm'

locale/gitlab.pot

@@ -20369,9 +20369,6 @@ msgstr ""
 msgid "Integrations|You can close this window."
 msgstr ""
 
-msgid "Integrations|You can now close this window and return to the GitLab for Jira application."
-msgstr ""
-
 msgid "Integrations|You can use this alias in your Slack commands"
 msgstr ""
 
@@ -21506,6 +21503,9 @@ msgstr ""
 msgid "JiraService|Work on Jira issues without leaving GitLab. Add a Jira menu to access a read-only list of your Jira issues. %{jira_issues_link_start}Learn more.%{link_end}"
 msgstr ""
 
+msgid "JiraService|You can now close this window and%{br}return to the GitLab for Jira application."
+msgstr ""
+
 msgid "JiraService|You must configure Jira before enabling this integration. %{jira_doc_link_start}Learn more.%{link_end}"
 msgstr ""
 
@@ -42820,7 +42820,7 @@ msgstr ""
 msgid "You are receiving this message because you are a GitLab administrator for %{url}."
 msgstr ""
 
-msgid "You are signed in to GitLab as %{user_link}"
+msgid "You are signed in to GitLab as:"
 msgstr ""
 
 msgid "You are trying to upload something other than an image. Please upload a .png, .jpg, .jpeg, .gif, .bmp, .tiff or .ico."