chore(icon): Update sidebar icon & favicon to align with branding (#1737)

app/react/sidebar/Header.test.tsx

@@ -123,7 +123,7 @@ describe('Header', () => {
     const logo = screen.getByAltText('Logo');
     expect(logo).toHaveAttribute(
       'src',
-      expect.stringContaining('logomark-CE.svg')
+      expect.stringContaining('portainer-p-icon-white.svg')
     );
   });
 

app/react/sidebar/Header.tsx

@@ -7,8 +7,7 @@ import { Link } from '@@/Link';
 
 import fullLogoBE from './portainer_logo-BE.svg';
 import fullLogoCE from './portainer_logo-CE.svg';
-import smallLogoBE from './logomark-BE.svg';
-import smallLogoCE from './logomark-CE.svg';
+import portainerIcon from './portainer-p-icon-white.svg';
 import { useSidebarState } from './useSidebarState';
 import styles from './Header.module.css';
 
@@ -89,7 +88,7 @@ function getLogo(isOpen: boolean, customLogo?: string) {
   }
 
   if (!isOpen) {
-    return isBE ? smallLogoBE : smallLogoCE;
+    return portainerIcon;
   }
 
   return isBE ? fullLogoBE : fullLogoCE;

app/react/sidebar/logomark-BE.svg

@@ -1,11 +0,0 @@
-<svg width="169" height="219" viewBox="0 0 169 219" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_261_120691)">
-<path d="M117.083 167.329H168.504V218.618H117.083V167.329Z" fill="#C080FF"/>
-<path d="M0.585938 0H80.7863C136.122 0 168.767 17.2947 168.767 73.6996V75.627C168.767 132.207 136.192 149.327 80.8564 149.327H63.3515V218.05H0.585938V0ZM77.1066 101.14C94.2436 101.14 103.268 94.7791 103.268 75.7672V73.5769C103.268 54.6526 94.2436 48.1693 77.1066 48.1693H63.369V101.122H77.1066V101.14Z" fill="#F7F6F3"/>
-</g>
-<defs>
-<clipPath id="clip0_261_120691">
-<rect width="168.414" height="218.719" fill="white" transform="translate(0.585938)"/>
-</clipPath>
-</defs>
-</svg>

app/react/sidebar/logomark-CE.svg

@@ -1,11 +0,0 @@
-<svg width="170" height="219" viewBox="0 0 170 219" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_261_120684)">
-<path d="M0.724609 0H80.925C136.261 0 168.905 17.2947 168.905 73.6996V75.627C168.905 132.207 136.331 149.327 80.9951 149.327H63.4901V218.05H0.724609V0ZM77.2453 101.14C94.3823 101.14 103.406 94.7791 103.406 75.7672V73.5769C103.406 54.6526 94.3823 48.1693 77.2453 48.1693H63.5077V101.122H77.2453V101.14Z" fill="#F7F6F3"/>
-<path d="M117.222 167.329H168.642V218.618H117.222V167.329Z" fill="#FF80F2"/>
-</g>
-<defs>
-<clipPath id="clip0_261_120684">
-<rect width="168.414" height="218.719" fill="white" transform="translate(0.724609)"/>
-</clipPath>
-</defs>
-</svg>

app/react/sidebar/portainer-p-icon-white.svg

@@ -0,0 +1,12 @@
+<svg width="288.58" height="302.75"  viewBox="0 0 288.58 302.75" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <style>
+      .cls-1 {
+      fill: #f7f6f3;
+      }
+    </style>
+  </defs>
+  <g id="Layer_1-2" data-name="Layer 1">
+    <path class="cls-1" d="M205.79,69.73v-14.85h23.37v-13.36h-80.27l-54.82-31.62V0h-19.35v9.87l-54.88,31.65H0v13.36h74.71v247.87h19.35V54.88h104.04v14.63c-1.2-.02-2.41-.03-3.64-.03h-85.8v233.27h67.15v-73.52h18.73c59.2,0,94.05-18.31,94.05-78.84v-2.06c0-56.38-30.5-76.23-82.79-78.6ZM74.71,41.52h-38.86l38.86-22.42v22.42ZM94.06,41.52v-22.39l38.81,22.39h-38.81ZM227.42,175.25h-51.76v-51.76h22.43v-53.98c2.61.03,5.18.1,7.69.21v53.76h21.64v51.76Z"/>
+  </g>
+</svg>