chore: updating Annotate favicon and logo icon (#2556)

* chore: replacing html icon with png icon and updating favicon

client/configuration/webpack/webpack.config.dev.js

@@ -9,6 +9,7 @@ const sharedConfig = require("./webpack.config.shared");
 const babelOptions = require("../babel/babel.dev");
 
 const fonts = path.resolve("src/fonts");
+const images = path.resolve("src/images");
 const nodeModules = path.resolve("node_modules");
 
 const devConfig = {
@@ -28,7 +29,7 @@ const devConfig = {
       {
         test: /\.(jpg|png|gif|eot|svg|ttf|woff|woff2|otf)$/i,
         loader: "file-loader",
-        include: [nodeModules, fonts],
+        include: [nodeModules, fonts, images],
         options: {
           name: "static/assets/[name].[ext]",
           // (thuang): This is needed to make sure @font url path is '/static/assets/'

client/configuration/webpack/webpack.config.prod.js

@@ -14,6 +14,7 @@ const CspHashPlugin = require("./cspHashPlugin");
 const sharedConfig = require("./webpack.config.shared");
 
 const fonts = path.resolve("src/fonts");
+const images = path.resolve("src/images");
 const nodeModules = path.resolve("node_modules");
 
 const prodConfig = {
@@ -43,7 +44,7 @@ const prodConfig = {
       {
         test: /\.(jpg|png|gif|eot|svg|ttf|woff|woff2|otf)$/i,
         loader: "file-loader",
-        include: [nodeModules, fonts],
+        include: [nodeModules, fonts, images],
         options: {
           name: "static/assets/[name]-[contenthash].[ext]",
           // (thuang): This is needed to make sure @font url path is '../static/assets/'

client/src/components/framework/logo.js

@@ -1,17 +1,15 @@
 import React from "react";
-import * as globals from "../../globals";
+import icon from "../../images/icon.png";
 
 const Logo = (props) => {
   const { size } = props;
   return (
-    <svg width={size} height={size} viewBox="0 0 48 48" fill="none">
-      <rect width="48" height="48" fill="white" />
-      <rect width="48" height="48" fill={globals.logoColor} />
-      <rect x="19" y="19" width="22" height="22" fill="white" />
-      <rect x="24" y="24" width="12" height="12" fill={globals.logoColor} />
-      <rect x="7" y="19" width="7" height="22" fill="white" />
-      <rect x="19" y="7" width="22" height="7" fill="white" />
-    </svg>
+    <img
+      src={icon}
+      height={size}
+      width={size}
+      alt="CELLxGENE Annotate Logo"
+     />
   );
 };