Update empty state of Slack Application page

What does this MR do and why?

Include "Learn more" link to docs when no projects are available.

Also update the width of the content to match updated designs.

Changelog: changed

EE: true

Screenshots or screen recordings

Scenario	Before	After
No projects
With projects

How to set up and validate locally

1. Visit http://127.0.0.1:3000/-/profile/slack/edit.
2. To simulate the empty state, apply this diff:

diff --git a/ee/app/assets/javascripts/integrations/gitlab_slack_application/index.js b/ee/app/assets/javascripts/integrations/gitlab_slack_application/index.js
index 8bbb81df997..c55c18617e0 100644
--- a/ee/app/assets/javascripts/integrations/gitlab_slack_application/index.js
+++ b/ee/app/assets/javascripts/integrations/gitlab_slack_application/index.js
@@ -21,7 +21,7 @@ export default () => {
     render(createElement) {
       return createElement(GitlabSlackApplication, {
         props: {
-          projects: JSON.parse(projects),
+          // projects: JSON.parse(projects),
           isSignedIn: parseBoolean(isSignedIn),
           signInPath,
           slackLinkPath,

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

• I have evaluated the MR acceptance checklist for this MR.

Related to #350227 (closed)