Brand Refresh

ts/components/About.tsx

@@ -6,28 +6,46 @@ import React from 'react';
 import type { LocalizerType } from '../types/Util';
 import { useEscapeHandling } from '../hooks/useEscapeHandling';
 
-export type PropsType = {
+export type AboutProps = Readonly<{
   closeAbout: () => unknown;
-  environment: string;
+  appEnv: string;
+  arch: string;
+  platform: string;
   i18n: LocalizerType;
   version: string;
-};
+}>;
 
 export function About({
   closeAbout,
-  environment,
+  appEnv,
+  arch,
+  platform,
   i18n,
   version,
-}: PropsType): JSX.Element {
+}: AboutProps): JSX.Element {
   useEscapeHandling(closeAbout);
 
+  let env: string;
+
+  if (platform === 'darwin') {
+    if (arch === 'arm64') {
+      env = i18n('icu:About__AppEnvironment--AppleSilicon', { appEnv });
+    } else {
+      env = i18n('icu:About__AppEnvironment--AppleIntel', { appEnv });
+    }
+  } else {
+    env = i18n('icu:About__AppEnvironment', { appEnv });
+  }
+
   return (
     <div className="About">
       <div className="module-splash-screen">
-        <div className="module-splash-screen__logo module-img--150" />
+        <div className="module-splash-screen__logo module-splash-screen__logo--128" />
 
+        <h1 className="About__Title">{i18n('icu:signalDesktop')}</h1>
         <div className="version">{version}</div>
-        <div className="environment">{environment}</div>
+        <div className="environment">{env}</div>
+        <br />
         <div>
           <a href="https://signal.org">signal.org</a>
         </div>