Update logos site-wide with new OpenSearch branding (#376)

Signed-off-by: Tommy Markley <markleyt@amazon.com>

src/core/public/chrome/ui/header/header_logo.tsx

@@ -37,6 +37,7 @@ import useObservable from 'react-use/lib/useObservable';
 import { Observable } from 'rxjs';
 import Url from 'url';
 import { ChromeNavLink } from '../..';
+import { OpenSearchDashboardsLogoDarkMode } from './branding/opensearch_dashboards_logo_darkmode';
 
 function findClosestAnchor(element: HTMLElement): HTMLAnchorElement | void {
   let current = element;
@@ -112,14 +113,12 @@ export function HeaderLogo({ href, navigateToApp, ...observables }: Props) {
   return (
     <EuiHeaderLogo
       data-test-subj="logo"
-      iconType="heatmap"
+      iconType={OpenSearchDashboardsLogoDarkMode}
       onClick={(e) => onClick(e, forceNavigation, navLinks, navigateToApp)}
       href={href}
       aria-label={i18n.translate('core.ui.chrome.headerGlobalNav.goHomePageIconAriaLabel', {
         defaultMessage: 'Go to home page',
       })}
-    >
-      OpenSearch Dashboards
-    </EuiHeaderLogo>
+    />
   );
 }

src/core/public/core_app/styles/_mixins.scss

@@ -16,7 +16,7 @@
   text-align: center;
   background-color: $euiColorEmptyShade;
   border-radius: 100%;
-  padding: $euiSize;
+  padding: $euiSize / 2;
 
   .euiIcon {
     vertical-align: baseline;

src/core/server/rendering/views/template.tsx

@@ -51,34 +51,20 @@ export const Template: FunctionComponent<Props> = ({
     strictCsp,
   },
 }) => {
-  const logo = (
-    <svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" viewBox="0 0 0 0">
-      <g fill="none">
-        <path
-          fill="#FDD009"
-          d="M11.9338171,13.1522761 L19.2872353,16.5080972 L26.7065664,10.0005147 C26.8139592,9.46384495 26.866377,8.92859725 26.866377,8.36846422 C26.866377,3.78984954 23.1459864,0.0647302752 18.5719941,0.0647302752 C15.8357526,0.0647302752 13.2836129,1.41337248 11.7323847,3.67480826 L10.4983628,10.0839872 L11.9338171,13.1522761 Z"
-        />
-        <path
-          fill="#23BAB1"
-          d="M4.32214501,20.9473399 C4.21475229,21.4841518 4.1596354,22.0410142 4.1596354,22.6044179 C4.1596354,27.1948353 7.89096419,30.9300509 12.4774572,30.9300509 C15.2361432,30.9300509 17.8007837,29.5687528 19.3495969,27.2841381 L20.5743853,20.8965739 L18.9399136,17.7698399 L11.5573744,14.401505 L4.32214501,20.9473399 Z"
-        />
-        <path
-          fill="#EE5097"
-          d="M4.27553714,8.20847294 L9.31503995,9.3995555 L10.4190826,3.6639867 C9.73040545,3.1371289 8.88035513,2.84874358 8.00601361,2.84874358 C5.81596922,2.84874358 4.0348979,4.63252339 4.0348979,6.82484908 C4.0348979,7.30904633 4.11572655,7.77333532 4.27553714,8.20847294"
-        />
-        <path
-          fill="#17A7E0"
-          d="M3.83806807,9.40996468 C1.58651435,10.1568087 0.0210807931,12.3172812 0.0210807931,14.6937583 C0.0210807931,17.0078087 1.45071086,19.0741436 3.5965765,19.8918041 L10.6668813,13.494428 L9.36879313,10.717795 L3.83806807,9.40996468 Z"
-        />
-        <path
-          fill="#92C73D"
-          d="M20.6421734,27.2838537 C21.3334075,27.8156885 22.1793383,28.1057803 23.0428837,28.1057803 C25.232786,28.1057803 27.0138574,26.3228537 27.0138574,24.130528 C27.0138574,23.6470417 26.9331708,23.1827528 26.7732181,22.7477573 L21.7379769,21.5681931 L20.6421734,27.2838537 Z"
-        />
-        <path
-          fill="#0678A0"
-          d="M21.6667227,20.2469532 L27.2099485,21.5446872 C29.4623545,20.7995495 31.0277881,18.6382239 31.0277881,16.2608936 C31.0277881,13.9511092 29.5947487,11.8871917 27.4447635,11.0719486 L20.1946185,17.4303615 L21.6667227,20.2469532 Z"
-        />
-      </g>
+  const openSearchLogo = (
+    <svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M61.7374 23.5C60.4878 23.5 59.4748 24.513 59.4748 25.7626C59.4748 44.3813 44.3813 59.4748 25.7626 59.4748C24.513 59.4748 23.5 60.4878 23.5 61.7374C23.5 62.987 24.513 64 25.7626 64C46.8805 64 64 46.8805 64 25.7626C64 24.513 62.987 23.5 61.7374 23.5Z"
+        fill="#005EB8"
+      />
+      <path
+        d="M48.0814 38C50.2572 34.4505 52.3615 29.7178 51.9475 23.0921C51.0899 9.36725 38.6589 -1.04463 26.9206 0.0837327C22.3253 0.525465 17.6068 4.2712 18.026 10.9805C18.2082 13.8961 19.6352 15.6169 21.9544 16.9399C24.1618 18.1992 26.9978 18.9969 30.2128 19.9011C34.0962 20.9934 38.6009 22.2203 42.063 24.7717C46.2125 27.8295 49.0491 31.3743 48.0814 38Z"
+        fill="#003B5C"
+      />
+      <path
+        d="M3.91861 14C1.74276 17.5495 -0.361506 22.2822 0.0524931 28.9079C0.910072 42.6327 13.3411 53.0446 25.0794 51.9163C29.6747 51.4745 34.3932 47.7288 33.974 41.0195C33.7918 38.1039 32.3647 36.3831 30.0456 35.0601C27.8382 33.8008 25.0022 33.0031 21.7872 32.0989C17.9038 31.0066 13.3991 29.7797 9.93694 27.2283C5.78746 24.1704 2.95092 20.6257 3.91861 14Z"
+        fill="#005EB8"
+      />
     </svg>
   );
   return (
@@ -134,7 +120,7 @@ export const Template: FunctionComponent<Props> = ({
           data-test-subj="osdLoadingMessage"
         >
           <div className="osdLoaderWrap">
-            {logo}
+            {openSearchLogo}
             <div
               className="osdWelcomeText"
               data-error-message={i18n('core.ui.welcomeErrorMessage', {
@@ -149,7 +135,7 @@ export const Template: FunctionComponent<Props> = ({
         </div>
 
         <div className="osdWelcomeView" id="osd_legacy_browser_error" style={{ display: 'none' }}>
-          {logo}
+          {openSearchLogo}
 
           <h2 className="osdWelcomeTitle">
             {i18n('core.ui.legacyBrowserTitle', {

src/plugins/dev_tools/public/plugin.ts

@@ -73,7 +73,7 @@ export class DevToolsPlugin implements Plugin<DevToolsSetup, void> {
         defaultMessage: 'Dev Tools',
       }),
       updater$: this.appStateUpdater,
-      euiIconType: 'heatmap',
+      euiIconType: '/plugins/home/assets/logos/opensearch_mark_default.svg',
       order: 9010,
       category: DEFAULT_APP_CATEGORIES.management,
       mount: async (params: AppMountParameters) => {

src/plugins/home/public/application/components/welcome.tsx

@@ -53,6 +53,7 @@ import { getServices } from '../opensearch_dashboards_services';
 import { TelemetryPluginStart } from '../../../../telemetry/public';
 
 import { SampleDataCard } from './sample_data';
+import OpenSearchMarkCentered from '../../assets/logos/opensearch_mark_centered.svg';
 interface Props {
   urlBasePath: string;
   onSkip: () => void;
@@ -148,7 +149,7 @@ export class Welcome extends React.Component<Props> {
             <div className="homWelcome__content eui-textCenter">
               <EuiSpacer size="xl" />
               <span className="homWelcome__logo">
-                <EuiIcon type="heatmap" size="xxl" />
+                <EuiIcon type={OpenSearchMarkCentered} size="original" />
               </span>
               <EuiTitle size="l" className="homWelcome__title">
                 <h1>

src/plugins/home/server/index.ts

@@ -39,7 +39,7 @@ import { configSchema, ConfigSchema } from '../config';
 
 export const config: PluginConfigDescriptor<ConfigSchema> = {
   exposeToBrowser: {
-    disableWelcomeScreen: true,
+    disableWelcomeScreen: false,
   },
   schema: configSchema,
   deprecations: ({ renameFromRoot }) => [

src/plugins/home/server/tutorials/opensearch_logs/index.ts

@@ -60,7 +60,7 @@ export function opensearchLogsSpecProvider(context: TutorialContext): TutorialSc
         learnMoreLink: '{config.docs.beats.filebeat}/filebeat-module-opensearch.html',
       },
     }),
-    euiIconType: 'heatmap',
+    euiIconType: '/plugins/home/assets/logos/opensearch_mark_default.svg',
     artifacts: {
       application: {
         label: i18n.translate('home.tutorials.opensearchLogs.artifacts.application.label', {

src/plugins/home/server/tutorials/opensearch_metrics/index.ts

@@ -59,7 +59,7 @@ export function opensearchMetricsSpecProvider(context: TutorialContext): Tutoria
         learnMoreLink: '{config.docs.beats.metricbeat}/metricbeat-module-opensearch.html',
       },
     }),
-    euiIconType: 'heatmap',
+    euiIconType: '/plugins/home/assets/logos/opensearch_mark_default.svg',
     artifacts: {
       application: {
         label: i18n.translate('home.tutorials.opensearchMetrics.artifacts.application.label', {

src/plugins/management/public/plugin.ts

@@ -91,7 +91,7 @@ export class ManagementPlugin implements Plugin<ManagementSetup, ManagementStart
         defaultMessage: 'Stack Management',
       }),
       order: 9040,
-      euiIconType: 'heatmap',
+      euiIconType: '/plugins/home/assets/logos/opensearch_mark_default.svg',
       category: DEFAULT_APP_CATEGORIES.management,
       updater$: this.appUpdater,
       async mount(params: AppMountParameters) {

src/plugins/opensearch_dashboards_react/public/exit_full_screen_button/exit_full_screen_button.tsx

@@ -40,6 +40,8 @@ export interface ExitFullScreenButtonProps {
 }
 
 import './index.scss';
+// eslint-disable-next-line @osd/eslint/no-restricted-paths
+import OpenSearchMarkDarkMode from '../../../home/public/assets/logos/opensearch_mark_darkmode.svg';
 
 class ExitFullScreenButtonUi extends PureComponent<ExitFullScreenButtonProps> {
   public onKeyDown = (e: KeyboardEvent) => {
@@ -83,7 +85,7 @@ class ExitFullScreenButtonUi extends PureComponent<ExitFullScreenButtonProps> {
           >
             <EuiFlexGroup component="span" responsive={false} alignItems="center" gutterSize="s">
               <EuiFlexItem grow={false}>
-                <EuiIcon type="heatmap" size="l" />
+                <EuiIcon type={OpenSearchMarkDarkMode} size="l" />
               </EuiFlexItem>
               <EuiFlexItem grow={false} data-test-subj="exitFullScreenModeText">
                 <div>