feat: add new logo (#65)

* update logo

* fix names

Author: t-aleksander

web/src/pages/main/SelectPath.tsx

@@ -2,8 +2,8 @@ import { useNavigate } from 'react-router-dom';
 import { shallow } from 'zustand/shallow';
 
 import { Card } from '../../shared/components/layout/Card/Card';
-import EnrollmentSelectGraphic from '../../shared/components/svg/EnrollmentSelectGraphic';
-import PasswordResetSelectGraphic from '../../shared/components/svg/PasswordResetSelectGraphic';
+import SvgEnrollmentSelectGraphic from '../../shared/components/svg/EnrollmentSelectGraphic';
+import SvgPasswordResetSelectGraphic from '../../shared/components/svg/PasswordResetSelectGraphic';
 import { routes } from '../../shared/routes';
 import { usePasswordResetStore } from '../passwordReset/hooks/usePasswordResetStore';
 import { PathSelectCard } from './DeviceSetupMethodCard/DeviceSetupMethodCard';
@@ -19,7 +19,7 @@ export const SelectPath = () => {
         onSelect={() => navigate(routes.token)}
         title="Enrollment process"
         subtitle="Confirm your new account"
-        logo={<EnrollmentSelectGraphic />}
+        logo={<SvgEnrollmentSelectGraphic />}
       />
 
       <PathSelectCard
@@ -30,7 +30,7 @@ export const SelectPath = () => {
         }}
         title="Password reset"
         subtitle="Reset password for existing account"
-        logo={<PasswordResetSelectGraphic />}
+        logo={<SvgPasswordResetSelectGraphic />}
       />
     </Card>
   );

web/src/shared/components/svg/DefguardLogoText.tsx

@@ -2,15 +2,15 @@ import type { SVGProps } from 'react';
 const SvgDefguardLogoText = (props: SVGProps<SVGSVGElement>) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
-    width={84}
-    height={24}
+    width={91}
+    height={27}
     fill="none"
-    viewBox="0 0 84 24"
+    viewBox="0 0 91 27"
     {...props}
   >
     <path
       fill="#222"
-      d="M8.424 5.623c-.803-.58-1.695-.803-2.587-.803C3.16 4.82.93 7.005.93 9.68v4.64c0 2.898 2.096 4.86 4.995 4.86 2.676 0 4.995-2.185 4.995-4.86V.225H8.424v5.397Zm0 8.696c0 1.427-1.026 2.542-2.498 2.542-1.427 0-2.497-1.115-2.497-2.542l.044-4.638c0-1.472 1.026-2.542 2.453-2.542 1.472 0 2.498 1.07 2.498 2.542v4.638ZM18.19 4.82c-2.676 0-4.995 2.185-4.995 4.86v4.64c0 2.898 2.096 4.86 4.995 4.86 2.676 0 4.995-2.185 4.995-4.86h-2.498c0 1.426-1.025 2.541-2.497 2.541-1.427 0-2.497-1.115-2.497-2.542v-1.16h7.492V9.682c0-2.899-2.096-4.861-4.995-4.861Zm2.497 6.02h-4.95V9.68c0-1.47 1.026-2.541 2.453-2.541 1.472 0 2.497 1.07 2.497 2.542v1.16ZM26.084 3.66v1.383h-1.249v2.319h1.249v11.595h2.497V7.362h1.249v-2.32H28.58V3.66c0-.713.49-1.16 1.16-1.16h.223V.183h-.402c-2.007 0-3.478 1.427-3.478 3.478ZM36.475 4.82c-2.676 0-4.995 2.185-4.995 4.86v4.64c0 2.898 2.007 4.86 4.772 4.86 1.16 0 2.274-.401 2.765-1.026v.803c0 1.517-.981 2.676-2.498 2.676l-.046-.002v2.187h.046c2.632 0 4.95-1.962 4.95-4.86V9.68c0-2.899-2.096-4.861-4.994-4.861Zm2.497 9.5c0 1.426-1.026 2.541-2.497 2.541-1.427 0-2.498-1.115-2.498-2.542V9.681c0-1.472 1.07-2.542 2.498-2.542 1.471 0 2.497 1.07 2.497 2.542v4.638ZM50.969 14.32c0 1.426-1.026 2.541-2.498 2.541-1.427 0-2.497-1.115-2.497-2.542V5.043h-2.498v9.276c0 2.899 2.052 4.861 4.95 4.861 2.543 0 5.04-1.962 5.04-4.86V5.042H50.97v9.276ZM60.557 4.82c-2.587 0-4.995 1.873-4.995 4.772h2.364c0-1.517 1.026-2.587 2.542-2.587 1.516 0 2.542 1.16 2.542 2.676v.847h-.045c-.713-.58-1.56-.892-2.586-.892-2.676 0-4.906 2.097-4.906 4.772 0 2.9 2.007 4.772 4.772 4.772 1.16 0 2.23-.401 2.765-1.026v.803h2.453V9.681c0-2.899-2.007-4.861-4.906-4.861Zm-.09 12.13c-1.426 0-2.497-1.114-2.497-2.542 0-1.471 1.07-2.542 2.498-2.542 1.472 0 2.497 1.07 2.497 2.542 0 1.428-1.025 2.543-2.497 2.543ZM67.38 8.521v10.436h2.498V8.521c0-.713.49-1.16 1.16-1.16h.713V5.044h-.892c-2.007 0-3.478 1.427-3.478 3.478ZM80.626.226v5.397c-.803-.58-1.695-.803-2.587-.803-2.676 0-4.906 2.185-4.906 4.86v4.64c0 2.898 2.096 4.86 4.995 4.86 2.676 0 4.995-2.185 4.995-4.86V.225h-2.498Zm0 14.093c0 1.427-1.026 2.542-2.498 2.542-1.427 0-2.498-1.115-2.498-2.542l.045-4.638c0-1.472 1.026-2.542 2.453-2.542 1.472 0 2.498 1.07 2.498 2.542v4.638Z"
+      d="M88.87 4.036v6.62h-.15c-.67-1.27-2-2.15-3.53-2.15h-1.48c-2.21 0-4 1.79-4 4v4.01c0 2.21 1.79 4 4 4h1.48c1.51 0 2.82-.85 3.5-2.09h.11l.08 1.87h1.44V4.036h-1.45Zm-3.16 14.98h-1.48c-1.66 0-3-1.34-3-3v-3c0-1.66 1.34-3 3-3h1.48c1.66 0 3 1.34 3 3v3c0 1.66-1.34 3-3 3ZM74.05 8.726h-.65c-.55 0-1 .45-1 1v10.58h1.65v-10.27h4.5v-1.31h-4.5ZM68.58 20.306l-.02-8.22c0-1.97-1.6-3.58-3.58-3.58h-1.95c-1.97 0-3.58 1.6-3.58 3.58h1.49a2.56 2.56 0 0 1 2.55-2.29h1.02a2.58 2.58 0 0 1 2.58 2.58v1.01h-4.44c-1.97 0-3.58 1.6-3.58 3.58s1.6 3.58 3.58 3.58h1.44c1.19 0 2.23-.59 2.88-1.48h.11v1.26h1.48l.02-.02Zm-4.45-1.07h-1.2c-1.26 0-2.27-1.02-2.27-2.27s1.02-2.27 2.27-2.27h4.17v1.58a2.97 2.97 0 0 1-2.97 2.97v-.01ZM54.81 16.016c0 1.66-1.34 3-3 3h-.76c-1.66 0-3-1.34-3-3v-7.29h-1.52v7.8c0 2.21 1.79 4 4 4h.77c1.51 0 2.82-.85 3.5-2.09h.11l.08 1.87h1.44V8.726h-1.59l-.02 7.29h-.01ZM41.5 18.146h-5.14c-.49 0-.88-.35-.88-.84s.39-.88.88-.88h3.15c1.93 0 3.5-1.57 3.5-3.5v-.92c0-1.11-.53-2.09-1.33-2.73v-.81h2.42v-1.31h-2.54c-.55 0-1 .45-1 1v.53c-.33-.11-.68-.18-1.05-.18h-1.72c-1.93 0-3.5 1.57-3.5 3.5v.92c0 1.18.59 2.22 1.48 2.85-.91.04-1.64.78-1.64 1.7 0 .76.51 1.38 1.2 1.58-1.16.36-2 1.33-2 2.48v.33c0 1.46 1.34 2.64 3 2.64h5.15c1.66 0 3-1.34 3-3v-.38c0-1.66-1.34-3-3-3l.02.02Zm-5.69-6.42c0-1.06.9-1.92 2-1.92h1.71c1.1 0 2 .86 2 1.92v1.48c0 1.06-.9 1.92-2 1.92h-1.71c-1.1 0-2-.86-2-1.92v-1.48Zm5.62 11.36h-5.01c-.97 0-1.76-.79-1.76-1.76s.79-1.76 1.76-1.76h5.01c.97 0 1.76.79 1.76 1.76s-.79 1.76-1.76 1.76ZM31.88 5.356v-1.32h-3.36c-.55 0-1 .45-1 1v3.69h-2.01v1.35h2.01v10.23h1.47v-10.23h2.63v-1.35h-2.63v-3.37h2.89ZM22.59 14.846H24v-1.34c0-2.76-2.24-5-5-5h-.46c-2.76 0-5 2.24-5 5v1.75c0 2.9 2.37 5.26 5.26 5.26h.46c2.28 0 4.18-1.53 4.78-3.61h-1.72c-.65 1.64-2.14 2.72-4.09 2.27-1.95-.45-3.12-2.2-3.12-4.11v-.22h7.48Zm-3.74-5.1c2.06 0 3.54 1.67 3.54 3.74v.09h-7.28v-.09a3.74 3.74 0 0 1 3.74-3.74ZM9.16 4.036v6.62h-.15c-.67-1.27-2-2.15-3.53-2.15H4c-2.21 0-4 1.79-4 4v4.01c0 2.21 1.79 4 4 4h1.48c1.51 0 2.82-.85 3.5-2.09h.11l.08 1.87h1.44V4.036H9.16ZM6 19.016H4.52c-1.66 0-3-1.34-3-3v-3c0-1.66 1.34-3 3-3H6c1.66 0 3 1.34 3 3v3c0 1.66-1.34 3-3 3Z"
     />
   </svg>
 );

web/src/shared/components/svg/EnrollmentSelectGraphic.tsx

@@ -1,5 +1,13 @@
-const EnrollmentSelectGraphic = () => (
-  <svg xmlns="http://www.w3.org/2000/svg" width={215} height={214} fill="none">
+import type { SVGProps } from 'react';
+const SvgEnrollmentSelectGraphic = (props: SVGProps<SVGSVGElement>) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width={215}
+    height={214}
+    fill="none"
+    viewBox="0 0 215 214"
+    {...props}
+  >
     <path
       fill="#CBD3D8"
       d="M56.255 98.95h22.9v8.18h-22.9v-8.18ZM50.345 55.06l4.74-5.55 31.28 26.71-4.74 5.55-31.28-26.71ZM137.925 98.95h22.9v8.18h-22.9v-8.18ZM129.365 75.75l30.6-26.25 4.76 5.55-30.6 26.25-4.76-5.55ZM54.805 149.44l26.94-26.94 5.17 5.17-26.94 26.94-5.17-5.17ZM129.235 127.69l5.14-5.19 27.85 27.62-5.14 5.19-27.85-27.62Z"
@@ -57,4 +65,4 @@ const EnrollmentSelectGraphic = () => (
     />
   </svg>
 );
-export default EnrollmentSelectGraphic;
+export default SvgEnrollmentSelectGraphic;

web/src/shared/components/svg/PasswordResetSelectGraphic.tsx

@@ -1,5 +1,13 @@
-const PasswordResetSelectGraphic = () => (
-  <svg xmlns="http://www.w3.org/2000/svg" width={215} height={214} fill="none">
+import type { SVGProps } from 'react';
+const SvgPasswordResetSelectGraphic = (props: SVGProps<SVGSVGElement>) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width={215}
+    height={214}
+    fill="none"
+    viewBox="0 0 215 214"
+    {...props}
+  >
     <g clipPath="url(#a)">
       <path
         fill="#CBD3D8"
@@ -152,4 +160,4 @@ const PasswordResetSelectGraphic = () => (
     </defs>
   </svg>
 );
-export default PasswordResetSelectGraphic;
+export default SvgPasswordResetSelectGraphic;