restyle about dialog

packages/help-extension/src/index.tsx

@@ -125,7 +125,9 @@ const plugin: JupyterFrontEndPlugin<void> = {
         );
 
         const notebookURL = 'https://github.com/jupyter/notebook';
-        const linkLabel = trans.__('JUPYTER NOTEBOOK ON GITHUB');
+        const contributorURL = 'https://github.com/jupyter/notebook/pulse';
+        const aboutJupyter = trans.__('JUPYTER NOTEBOOK ON GITHUB');
+        const contList = trans.__('CONTRIBUTOR LIST');
         const externalLinks = (
           <span>
             <a
@@ -134,15 +136,25 @@ const plugin: JupyterFrontEndPlugin<void> = {
               rel="noopener noreferrer"
               className="jp-Button-flat jp-AboutNotebook-about-externalLinks"
             >
-              {linkLabel}
+              {aboutJupyter}
+            </a>
+            <a
+              href={contributorURL}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="jp-Button-flat jp-AboutNotebook-about-externalLinks"
+            >
+              {contList}
             </a>
           </span>
         );
         const version = trans.__('Version: %1', app.version);
+        const copyright = trans.__('© 2021-2022 Jupyter Notebook Contributors')
         const body = (
           <>
-            <span className="jp-AboutNotebook-body">{version}</span>
+            <span className="jp-AboutNotebook-version">{version}</span>
             <div>{externalLinks}</div>
+            <span className='jp-AboutNotebook-about-copyright'>{copyright}</span>
           </>
         );
 

packages/help-extension/style/base.css

@@ -1,5 +1,6 @@
 .jp-AboutNotebook .jp-Dialog-header {
   justify-content: center;
+  padding: 0;
 }
 
 .jp-AboutNotebook-header {
@@ -13,12 +14,23 @@
   margin-left: 16px;
 }
 
+.jp-AboutNotebook-version {
+  color: var(--jp-ui-font-color1);
+  font-size: var(--jp-ui-font-size1);
+  padding: var(--jp-flat-button-padding);
+  font-weight: 400;
+  letter-spacing: 0.4px;
+  line-height: 1.12;
+  min-width: 360px;
+  text-align: center;
+}
+
 .jp-AboutNotebook-body {
   display: flex;
   font-size: var(--jp-ui-font-size2);
   padding: var(--jp-flat-button-padding);
   color: var(--jp-ui-font-color1);
-  text-align: left;
+  text-align: center;
   flex-direction: column;
   min-width: 360px;
   overflow: hidden;
@@ -37,6 +49,10 @@
   color: var(--jp-warn-color0);
 }
 
+.jp-AboutNotebook-about-copyright {
+  padding-top: 25px;
+}
+
 .jp-AboutNotebook-shortcuts {
   padding: 10px;
 }