Improve the help center content (#1363)

Co-authored-by: nickzhums <[email protected]>

Author: jdneo

package.nls.json

@@ -7,7 +7,7 @@
 
     "walkthrough.java.projects.inactive": "Java Project Explorer helps you to manage your projects and dependencies. Create a new project or open an existing folder to see the full features.\n[Open Command Palette](command:workbench.action.quickOpen?%22>java%22)\n__Try searching for 'Create Java Project' or 'Open Folder'__",
 
-    "walkthrough.java.debugAndTest":"Run and debug your application using the debugger. [Learn More...](https://aka.ms/java-walkthrough-debug)\nThe [Testing Explorer](command:testExplorer.focus) allows you to view, run and manage all test cases in your project. [Learn More...](https://aka.ms/java-walkthrough-test)\n[Show Run and Debug View](command:workbench.view.debug)",
+    "walkthrough.java.debugAndTest":"Run and debug your application using the debugger. [Learn More...](https://aka.ms/java-walkthrough-debug)\nThe [Testing Explorer](command:workbench.view.testing.focus) allows you to view, run and manage all test cases in your project. [Learn More...](https://aka.ms/java-walkthrough-test)\n[Show Run and Debug View](command:workbench.view.debug)",
 
     "walkthrough.java.extensions": "Install extensions to support additional frameworks such as Spring Boot, Application Servers, key mappings and so on.\n[Browse Recommended Extensions](command:toSide:java.extGuide)",
 

src/welcome/assets/components/ControllerPanel.tsx

@@ -12,7 +12,7 @@ export default class ControllerPanel extends React.Component<{
     let {showWhenUsingJava} = this.props;
 
     return <Form>
-        <Form.Check defaultChecked={showWhenUsingJava} label="Show welcome page when using Java" onChange={toggleVisibility}/>
+        <Form.Check defaultChecked={showWhenUsingJava} label="Show Help Center when using Java" onChange={toggleVisibility}/>
     </Form>;
   }
 

src/welcome/assets/components/SocialMediaPanel.tsx

@@ -3,7 +3,7 @@
 
 import * as React from "react";
 import { Icon } from "@iconify/react";
-import twitterIcon from "@iconify-icons/codicon/twitter";
+import bookIcon from "@iconify-icons/codicon/book";
 import githubIcon from "@iconify-icons/codicon/github-inverted";
 import { ListGroup } from "react-bootstrap";
 import { encodeCommandUriWithTelemetry } from "../../../utils/webview";
@@ -12,7 +12,7 @@ import { WEBVIEW_ID } from "../utils";
 export default class SocialMediaPanel extends React.Component {
     render() {
         const links = [
-            { name: "Twitter", command: "java.helper.openUrl", args: ["https://twitter.com/intent/tweet?via=code&hashtags=Java,HappyCoding"], icon: twitterIcon },
+            { name: "Documentation", command: "java.helper.openUrl", args: ["https://code.visualstudio.com/docs/java/java-tutorial"], icon: bookIcon },
             { name: "Questions & Issues", command: "java.helper.openUrl", args: ["https://github.com/microsoft/vscode-java-pack/issues"], icon: githubIcon },
         ];
         const elements = links.map(link => (

src/welcome/assets/style.scss

@@ -6,6 +6,11 @@ $nav-tabs-link-active-bg: transparent;
 $nav-tabs-link-active-border-color: transparent;
 $nav-tabs-link-hover-border-color: transparent;
 $nav-tabs-border-color: transparent;
+
+$list-group-bg: var(--vscode-peekViewTitle-background);
+$list-group-border-color: var(--vscode-peekViewTitle-background);
+$list-group-action-active-bg: $list-group-bg;
+
 @import "~bootstrap/scss/bootstrap";
 
 .nav-link,