Squash: Update icons in storybooks

packages/fxa-settings/.storybook/design-guide/Header.tsx

@@ -5,7 +5,11 @@ const Header = () => {
   return (
     <div className="bg-grey-50 flex items-center justify-between sticky z-20 top-0 py-4 pb-3 border-b border-grey-400/25 px-2 -mt-4 -ml-12 -mr-12">
       <div className="flex items-center gap-2">
-        <img src="assets/logo.svg" alt="firefox account logo" />
+        <img
+          className="h-12"
+          src="assets/moz-m-logo.svg"
+          alt="firefox account logo"
+        />
         <h1 className="text-xl font-bold text-grey-900">Design Guide</h1>
       </div>
       <div>

packages/fxa-settings/.storybook/fxaTheme.js

@@ -5,7 +5,7 @@ export default create({
 
   brandTitle: 'Firefox Accounts Storybook',
   brandUrl: 'https://github.com/mozilla/fxa',
-  brandImage: 'assets/logo.png',
+  brandImage: 'assets/moz-logo-bw-rgb.svg',
 
   colorPrimary: '#F3A03F',
   colorSecondary: '#0060DF',

packages/fxa-settings/public/assets/moz-logo-bw-rgb.svg

@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 2000 571.9" style="enable-background:new 0 0 2000 571.9;" xml:space="preserve">
+<g>
+	<rect y="0" width="2000" height="571.9"/>
+	<path class="st0" d="M1910.2,410.5c-3.9,1.1-7.2,1.7-10.5,1.7c-11.7,0-17.2-5-17.2-19.4V284.1c0-57.1-45.5-84.9-99.3-84.9
+		c-41.1,0-63.2,5-107.1,22.7l-9.8,57.6l57.1,6.1l8.1-28.2c11.7-6.1,23.3-7.2,38.3-7.2c40.5,0,41.1,30.5,41.1,56v8.3
+		c-12.8-1.7-27.2-2.2-41.1-2.2c-57.1,0-116.5,14.4-116.5,76c0,52.1,41,71.6,77.1,71.6c40.5,0,66-24.4,80.4-49.9
+		c3.3,30.5,21.6,49.9,54.9,49.9c15.5,0,31.6-4.4,44.9-11.7L1910.2,410.5z M1756.6,408.9c-21.6,0-29.4-12.8-29.4-28.9
+		c0-27.2,22.2-34.4,47.7-34.4c11.6,0,24.4,1.7,36.1,3.3C1809.3,390.6,1782.1,408.9,1756.6,408.9z M1660.5,72.7l-108.2,381.7h-70.5
+		L1590,72.7H1660.5z M1515.2,72.7L1407,454.4h-70.4l108.2-381.7H1515.2z M1214.8,204.2h74.9V294h-74.9V204.2z M1214.8,364.5h74.9
+		v89.9h-74.9V364.5z M1105.8,361.2l56.6,5.5l-15.5,87.7H928.3l-7.2-37.7l137.6-158.1h-78.2l-11.1,38.8l-51.6-5.6l8.9-87.7h219.7
+		l5.6,37.7L1013.2,400h81L1105.8,361.2z M747.3,199.2c-89.9,0-134.3,60.5-134.3,133.7c0,79.9,53.3,127,130.4,127
+		c79.9,0,137.6-50.5,137.6-130.4C881,259.6,837.1,199.2,747.3,199.2z M745.6,405c-38.8,0-58.8-33.3-58.8-76.6
+		c0-47.2,22.7-74.3,59.4-74.3c33.8,0,61,22.7,61,73.2C807.2,375,782.8,405,745.6,405z M548.6,400h33.3v54.4H477V313.5
+		c0-43.3-14.4-59.9-42.7-59.9c-34.4,0-48.3,24.4-48.3,59.4V400h33.3v54.4H314.5V313.5c0-43.3-14.4-59.9-42.7-59.9
+		c-34.4,0-48.3,24.4-48.3,59.4V400h47.7v54.4H118.7V400h33.3V258.5h-33.3v-54.4h104.8v37.7c15-26.6,41.1-42.7,76-42.7
+		c36.1,0,69.3,17.2,81.6,53.8c13.9-33.3,42.2-53.8,81.6-53.8c44.9,0,86,27.2,86,86.5V400z" fill='#FFFFFF'/>
+</g>
+</svg>

packages/fxa-settings/public/assets/moz-m-logo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" style="enable-background:new 0 0 500 500" xml:space="preserve"><path d="M-4-4h508v508H-4z"/><path d="M428.2 314h29.1v47.5h-91.7V238.4c0-37.8-12.6-52.4-37.3-52.4-30.1 0-42.2 21.3-42.2 51.9V314h29.1v47.5h-91.7V238.4c0-37.8-12.6-52.4-37.4-52.4-30.1 0-42.2 21.3-42.2 51.9V314h41.7v47.5H52.3V314h29.1V190.3H52.3v-47.5H144v33c13.1-23.3 35.9-37.3 66.4-37.3 31.5 0 60.6 15 71.3 47 12.1-29.1 36.9-47 71.3-47 39.3 0 75.2 23.8 75.2 75.7V314z" style="fill:#fff"/></svg>