changed logo and theme

public/browserconfig.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <TileColor>#da532c</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>

public/index.html

@@ -17,8 +17,8 @@
       href="%PUBLIC_URL%/favicon-16x16.png"
     />
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#6878d6" />
-    <meta name="msapplication-TileColor" content="#6878d6" />
+    <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#1395f8" />
+    <meta name="msapplication-TileColor" content="#1395f8" />
     <meta name="theme-color" content="#000000" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="description" content="Dashboard for ZeitAdler" />

public/locales/de/translation.json

@@ -181,7 +181,8 @@
       }
     },
     "signUp": {
-      "button": "Kostenpflichtig bestellen",
+      "button": "Registrieren",
+      "alreadyHaveAccount": "Sie haben bereits ein Konto?",
       "pendingEmailVerification": {
         "title": "E-Mail-Verifizierung ausstehend",
         "description": "Bitte überprüfen Sie Ihr E-Mail-Postfach und klicken Sie auf den Link in der E-Mail, um Ihre E-Mail-Adresse zu verifizieren."

public/locales/en/translation.json

@@ -150,7 +150,7 @@
     "rememberMe": "Remember me",
     "privacyPolicy": "I have read and accept the <dataLink>{{dataPrivacy}}</dataLink>",
     "privacyPolicyLink": "Privacy Policy",
-    "loginLink": "Login",
+    "loginLink": "Login now",
     "signUpLink": "Sign up now",
     "login": {
       "button": "Login",
@@ -181,7 +181,8 @@
       }
     },
     "signUp": {
-      "button": "Order with obligation to pay",
+      "button": "Sign up",
+      "alreadyHaveAccount": "Already have an account?",
       "pendingEmailVerification": {
         "title": "Email verification pending",
         "description": "Please check your email inbox and click on the link in the e-mail to verify your e-mail address."

public/safari-pinned-tab.svg

@@ -9,10 +9,20 @@ Created by potrace 1.14, written by Peter Selinger 2001-2017
 </metadata>
 <g transform="translate(0.000000,700.000000) scale(0.100000,-0.100000)"
 fill="#000000" stroke="none">
-<path d="M768 6984 c-289 -52 -538 -242 -672 -511 -40 -81 -54 -122 -77 -228
--16 -75 -17 -245 -16 -2770 l2 -2690 23 -80 c107 -367 377 -619 742 -690 109
--21 5347 -22 5456 0 300 58 533 232 672 500 40 77 58 129 82 235 19 83 19 152
-17 2775 l-2 2690 -23 79 c-101 358 -365 609 -720 686 -84 18 -185 18 -2747 18
--2224 0 -2673 -2 -2737 -14z"/>
+<path d="M1445 5448 c-4 -15 -35 -189 -35 -200 0 -4 157 -9 348 -10 l349 -3
+-447 -551 -447 -552 -17 -90 c-9 -49 -16 -93 -16 -96 0 -3 225 -6 499 -6 l499
+0 19 103 18 102 -347 3 c-192 1 -348 6 -348 10 0 5 200 255 445 556 l446 547
+14 77 c8 42 15 87 15 100 l0 22 -495 0 c-388 0 -496 -3 -500 -12z"/>
+<path d="M2742 4708 c-73 -414 -133 -756 -132 -761 0 -4 188 -6 417 -5 l418 3
+12 70 c7 39 15 80 18 93 l5 22 -295 0 c-162 0 -295 4 -295 8 0 4 18 109 40
+232 22 123 40 228 40 232 0 4 119 8 264 8 l264 0 11 68 c6 37 14 79 17 95 l6
+27 -261 0 c-242 0 -261 1 -261 18 0 9 18 114 39 232 l37 215 296 3 296 2 16
+88 c9 48 16 90 16 95 0 4 -188 7 -418 7 l-418 0 -132 -752z"/>
+<path d="M4175 5448 c-6 -16 -265 -1481 -265 -1497 0 -8 33 -11 122 -9 l122 3
+133 745 c72 410 132 751 132 758 1 9 -29 12 -119 12 -87 0 -122 -3 -125 -12z"/>
+<path d="M4825 5448 c-2 -7 -9 -42 -15 -78 -6 -36 -14 -75 -17 -87 l-5 -23
+204 -2 205 -3 -117 -657 -116 -658 122 0 c108 0 123 2 128 18 2 9 55 306 117
+660 l113 642 203 0 c112 0 203 2 203 4 0 2 7 40 15 83 8 43 15 86 15 96 0 16
+-32 17 -525 17 -412 0 -527 -3 -530 -12z"/>
 </g>
 </svg>

src/App.js

@@ -121,7 +121,7 @@ export function App() {
       isDevelopmentEnv() ? "Dev" : "Stable"
     } %c \n`,
     "background-color: #555;color: #fff;padding: 3px 2px 3px 3px;border-radius: 3px 0 0 3px;font-family: DejaVu Sans,Verdana,Geneva,sans-serif;text-shadow: 0 1px 0 rgba(1, 1, 1, 0.3)",
-    "background-color: #bc81e0;background-image: linear-gradient(90deg, #6878d6, #4d61d6);color: #fff;padding: 3px 3px 3px 2px;border-radius: 0 3px 3px 0;font-family: DejaVu Sans,Verdana,Geneva,sans-serif;text-shadow: 0 1px 0 rgba(1, 1, 1, 0.3)",
+    "background-color: #bc81e0;background-image: linear-gradient(90deg, #0f88e5, #4bb1ff);color: #fff;padding: 3px 3px 3px 2px;border-radius: 0 3px 3px 0;font-family: DejaVu Sans,Verdana,Geneva,sans-serif;text-shadow: 0 1px 0 rgba(1, 1, 1, 0.3)",
     "background-color: transparent"
   );
 

src/Components/AppRoutes/index.js

@@ -27,19 +27,8 @@ const StoreCalendarAuth = lazy(() => import("../../Pages/Store/Calendar/Auth"));
 //const Feedback = lazy(() => import("../../Pages/Feedback"));
 const UserProfile = lazy(() => import("../../Pages/UserProfile"));
 
-export function AuthenticationRoutes() {
-  return (
-    <Routes>
-      <Route
-        path={Constants.ROUTE_PATHS.AUTHENTICATION.LOGIN}
-        element={
-          <MySupsenseFallback>
-            <Authentication method={AuthenticationMethod.LOGIN} />
-          </MySupsenseFallback>
-        }
-      />
-
-      <Route
+/*
+ <Route
         path={`${Constants.ROUTE_PATHS.AUTHENTICATION.SIGN_UP}/basic`}
         element={
           <MySupsenseFallback>
@@ -56,6 +45,28 @@ export function AuthenticationRoutes() {
           </MySupsenseFallback>
         }
       />
+*/
+
+export function AuthenticationRoutes() {
+  return (
+    <Routes>
+      <Route
+        path={Constants.ROUTE_PATHS.AUTHENTICATION.LOGIN}
+        element={
+          <MySupsenseFallback>
+            <Authentication method={AuthenticationMethod.LOGIN} />
+          </MySupsenseFallback>
+        }
+      />
+
+      <Route
+        path={Constants.ROUTE_PATHS.AUTHENTICATION.SIGN_UP}
+        element={
+          <MySupsenseFallback>
+            <Authentication method={AuthenticationMethod.SIGN_UP} />
+          </MySupsenseFallback>
+        }
+      />
 
       <Route
         path={`${Constants.ROUTE_PATHS.AUTHENTICATION.CHECKOUT_SUCCESS}/:sessionId`}

src/Components/SideMenu/index.js

@@ -13,7 +13,12 @@ import {
 import { Button, Card, Divider, Flex, Menu, Typography } from "antd";
 import { useEffect, useState } from "react";
 import { useLocation, useNavigate } from "react-router-dom";
-import { BreakpointLgWidth, Constants, isDevelopmentEnv } from "../../utils";
+import {
+  AppStyle,
+  BreakpointLgWidth,
+  Constants,
+  isDevelopmentEnv,
+} from "../../utils";
 import { useTranslation } from "react-i18next";
 import { useSideBarContext } from "../../Contexts/SideBarContext";
 import { useStoresContext } from "../../Contexts/StoresContext";
@@ -207,7 +212,9 @@ export function SideMenuContent({
           <MyAppLogo width={200} height={60} />
 
           {isDevelopmentEnv() && (
-            <p style={{ color: "#6878d6", fontWeight: "bold" }}>DEV</p>
+            <p style={{ color: AppStyle.colors.primary, fontWeight: "bold" }}>
+              DEV
+            </p>
           )}
         </div>
 
@@ -235,7 +242,7 @@ export function SideMenuContent({
 
         {showPaymentPlanInfoBanner && (
           <Card
-            style={{ backgroundColor: "#6878d6", margin: 8 }}
+            style={{ backgroundColor: AppStyle.colors.primary, margin: 8 }}
             styles={{ body: { padding: 10 } }}
           >
             <Flex justify="center" align="center">
@@ -290,7 +297,7 @@ export function SideMenuContent({
 {sideBarContext.accountPlanExpiry !== undefined &&
           accountPlanExpiry > 0 && (
             <Card
-              style={{ backgroundColor: "#6878d6", margin: 8 }}
+              style={{ backgroundColor: AppStyle.colors.primary, margin: 8 }}
               bodyStyle={{ padding: 10 }}
             >
               <Flex justify="center" align="center">

src/Pages/Authentication/CheckoutCanceled.js

@@ -1,4 +1,4 @@
-import { Button, Modal, Result } from "antd";
+/*import { Button, Modal, Result } from "antd";
 import { useParams } from "react-router-dom";
 import { useEffect, useState } from "react";
 import MyCenteredSpin from "../../Components/MyCenteredSpin";
@@ -66,3 +66,4 @@ export default function CheckoutCanceled() {
     </Modal>
   );
 }
+*/

src/Pages/Authentication/CheckoutSuccess.js

@@ -1,4 +1,4 @@
-import { useParams } from "react-router-dom";
+/*import { useParams } from "react-router-dom";
 import { useEffect } from "react";
 import { myFetch, showUnkownErrorNotification } from "../../utils";
 import MyCenteredSpin from "../../Components/MyCenteredSpin";
@@ -35,3 +35,4 @@ export default function CheckoutSuccess() {
 
   return <MyCenteredSpin fullHeight />;
 }
+*/

src/Pages/Authentication/Login.js

@@ -289,7 +289,9 @@ export function Login({ notificationApi }) {
           <Button
             type="link"
             style={{ padding: 0 }}
-            onClick={() => BackToZeitAdlerPricingOverview()}
+            onClick={() =>
+              navigate(Constants.ROUTE_PATHS.AUTHENTICATION.SIGN_UP)
+            }
           >
             {t("authentication.signUpLink")}
           </Button>

src/Pages/Authentication/SignUp.js

@@ -35,12 +35,129 @@ import MyAppLogo from "../../Components/MyAppLogo";
 import { CheckOutlined } from "@ant-design/icons";
 import { RequestState } from "../../Components/MyRequestStateItem";
 import { useAppContext } from "../../Contexts/AppContext";
-/*
+
 const SignUpStep = {
   SIGN_UP: 1,
   PENDING_EMAIL_VERIFICATION: 2,
 };
-*/
+
+export default function SignUp({ notificationApi }) {
+  const { t, i18n } = useTranslation();
+  const navigate = useNavigate();
+
+  const [step, setStep] = useState(SignUpStep.SIGN_UP);
+  const [isRequesting, setIsRequesting] = useState(false);
+  const recaptchaRef = useRef(null);
+  const recaptchaValueRef = useRef(null);
+
+  const [form] = Form.useForm();
+
+  if (step === SignUpStep.PENDING_EMAIL_VERIFICATION) {
+    return <PendingEmailVerification />;
+  }
+
+  return (
+    <Form
+      form={form}
+      layout="vertical"
+      requiredMark={false}
+      initialValues={{
+        rememberMe: false,
+      }}
+    >
+      <MyCompanyNameFormInput />
+
+      <MyCompanyAddressFormInput />
+
+      <MyUsernameFormInput
+        propsFormItem={{ tooltip: t("common.usernameInfo") }}
+      />
+
+      <MyEmailFormInput hasFeedback={true} />
+
+      <MyPasswordFormInput />
+
+      <MyRecaptcha
+        recaptchaRef={recaptchaRef}
+        recaptchaValueRef={recaptchaValueRef}
+      />
+
+      <PrivacyPolicyCheckbox />
+
+      <Button
+        type="primary"
+        size="large"
+        block
+        loading={isRequesting}
+        onClick={() =>
+          form
+            .validateFields()
+            .then((values) => {
+              myFetch({
+                url: `/user/auth/signup`,
+                method: "POST",
+                body: {
+                  companyName: values.companyName,
+                  companyAddress: values.companyAddress,
+                  username: values.username,
+                  email: values.email.toLocaleLowerCase(),
+                  password: EncodeStringToBase64(values.password),
+                  language: i18n.language,
+                  recaptcha: recaptchaValueRef.current,
+                },
+                notificationApi: notificationApi,
+                t: t,
+              })
+                .then((data) => {
+                  setIsRequesting(RequestState.NOTHING);
+                  setStep(SignUpStep.PENDING_EMAIL_VERIFICATION);
+                })
+                .catch(() => {
+                  recaptchaRef.current.reset();
+                  showUnkownErrorNotification(notificationApi, t);
+                  setIsRequesting(false);
+                });
+            })
+            .catch(() => showInputsInvalidNotification(notificationApi, t))
+        }
+      >
+        {t("authentication.signUp.button")}
+      </Button>
+
+      <Flex justify="center" style={{ paddingTop: 12 }}>
+        <Typography.Text>
+          {t("authentication.signUp.alreadyHaveAccount")}{" "}
+          <Button
+            type="link"
+            style={{ padding: 0 }}
+            onClick={() => navigate(Constants.ROUTE_PATHS.AUTHENTICATION.LOGIN)}
+          >
+            {t("authentication.loginLink")}
+          </Button>
+        </Typography.Text>
+      </Flex>
+    </Form>
+  );
+}
+
+function PendingEmailVerification() {
+  const { t } = useTranslation();
+
+  return (
+    <Flex vertical style={{ marginTop: 12 }}>
+      <Typography.Title level={2} style={{ textAlign: "center" }}>
+        {t("authentication.signUp.pendingEmailVerification.title")}
+      </Typography.Title>
+      <Typography.Text style={{ textAlign: "center" }}>
+        {t("authentication.signUp.pendingEmailVerification.description")}
+      </Typography.Text>
+    </Flex>
+  );
+}
+
+/*
+
+/*
 export default function SignUp({ paymentPlan }) {
   const [notificationApi, notificationContextHolder] =
     notification.useNotification();
@@ -54,7 +171,7 @@ export default function SignUp({ paymentPlan }) {
   if (step === SignUpStep.PENDING_EMAIL_VERIFICATION) {
     return <PendingEmailVerification />;
   } */
-
+/*
   return (
     <>
       {notificationContextHolder}
@@ -374,3 +491,4 @@ function CostSummary({ notificationApi, paymentPlan, form }) {
     </Affix>
   );
 }
+*/

src/Pages/Authentication/index.js

@@ -4,10 +4,12 @@ import { Trans, useTranslation } from "react-i18next";
 import MyAppLogo from "../../Components/MyAppLogo";
 import ReCAPTCHA from "react-google-recaptcha";
 import { ForgotPassword, Login } from "./Login";
+import SignUp from "./SignUp";
 
 export const AuthenticationMethod = {
   LOGIN: 1,
-  FORGOT_PASSWORD: 2,
+  SIGN_UP: 2,
+  FORGOT_PASSWORD: 3,
 };
 
 export default function Authentication({ method }) {
@@ -37,6 +39,8 @@ export default function Authentication({ method }) {
 
         {method === AuthenticationMethod.LOGIN ? (
           <Login notificationApi={notificationApi} />
+        ) : method === AuthenticationMethod.SIGN_UP ? (
+          <SignUp notificationApi={notificationApi} />
         ) : (
           <ForgotPassword notificationApi={notificationApi} />
         )}
@@ -117,7 +121,8 @@ export function PendingEmailVerification() {
     />
   );
 }
-
+/*
 export function BackToZeitAdlerPricingOverview() {
   window.location.href = process.env.REACT_APP_ZEITADLER_HOMEPAGE_PRICING;
 }
+*/

src/Pages/Dashboard/index.js

@@ -2,15 +2,24 @@ import { Card, Flex, Spin } from "antd";
 import { useState } from "react";
 import MyCenteredContainer from "../../Components/MyContainer";
 import { useTranslation } from "react-i18next";
+import { MyEmpty } from "../../Components/MyEmpty";
+import PageInDevelopment from "../PageInDevelopment";
 
 export default function Dashboard() {
   const { t } = useTranslation();
 
-  const [isLoading, setIsLoading] = useState(true);
+  // const [isLoading, setIsLoading] = useState(true);
 
   return (
     <Card title={t("dashboard.pageTitle")}>
-      {isLoading && (
+      <PageInDevelopment showBackButton={false} />
+    </Card>
+  );
+}
+
+/*
+
+ {isLoading && (
         <MyCenteredContainer fullHeight height={800}>
           <Spin size="large" />
         </MyCenteredContainer>
@@ -30,6 +39,5 @@ export default function Dashboard() {
           }}
         />
       </Flex>
-    </Card>
-  );
-}
+
+*/

src/Pages/PaymentPlan/index.js

@@ -4,7 +4,7 @@ import { myFetch, showUnkownErrorNotification } from "../../utils";
 import { useTranslation } from "react-i18next";
 import { CreditCardOutlined } from "@ant-design/icons";
 import { useState } from "react";
-import { ChoosenProduct } from "../Authentication/SignUp";
+// import { ChoosenProduct } from "../Authentication/SignUp";
 
 export default function PaymentPlan() {
   const { t } = useTranslation();
@@ -16,11 +16,11 @@ export default function PaymentPlan() {
   const [isRequestingBillingDetails, setIsRequestingBillingDetails] =
     useState(false);
 
-  return (
-    <>
-      {notificationContextHolder}
+  return <>{notificationContextHolder}</>;
+}
 
-      <ChoosenProduct
+/*
+<ChoosenProduct
         t={t}
         paymentPlan={appContext.paymentPlan}
         extra={
@@ -47,5 +47,4 @@ export default function PaymentPlan() {
         }
       />
     </>
-  );
-}
+*/

src/Pages/Store/Services/index.js

@@ -17,6 +17,7 @@ import {
 import { useTranslation } from "react-i18next";
 import { useEffect, useState } from "react";
 import {
+  AppStyle,
   Constants,
   myFetch,
   showInputsInvalidNotification,
@@ -342,7 +343,10 @@ function Service({
                                     >
                                       <Avatar
                                         size="small"
-                                        style={{ backgroundColor: "#6878d6" }}
+                                        style={{
+                                          backgroundColor:
+                                            AppStyle.colors.primary,
+                                        }}
                                       >
                                         {user.username.charAt(0)}
                                       </Avatar>

src/ZeitAdler.svg

@@ -1,4 +1,4 @@
-<svg width="426" height="130" viewBox="0 0 426 130" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M47.2625 84.44H71.3265L70.8145 87H43.4225L43.8705 84.568L74.5265 44.696H51.4865L51.9985 42.072H78.3025L77.8545 44.568L47.2625 84.44ZM88.9815 44.44L85.6535 63.32H103.574L103.126 65.624H85.2695L81.8775 84.632H101.718L101.27 87H78.5495L86.5495 42.072H109.206L108.757 44.44H88.9815ZM120.867 42.072L112.867 87H109.987L117.987 42.072H120.867ZM156.193 42.072L155.745 44.44H142.945L135.457 87H132.577L140.065 44.44H127.265L127.713 42.072H156.193Z" fill="#242A56"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M387 30H163V99H387V30ZM188.312 79.064H205.08L206.36 87H217.944L209.624 42.072H196.952L172.76 87H184.216L188.312 79.064ZM201.176 54.104L203.8 70.744H192.6L201.176 54.104ZM258.348 44.312C255.361 42.8187 251.798 42.072 247.66 42.072H230.827L222.891 87H239.724C244.417 87 248.705 86.0613 252.588 84.184C256.513 82.3067 259.734 79.6613 262.252 76.248C264.812 72.8347 266.476 68.9307 267.243 64.536C267.542 62.6587 267.691 61.1013 267.691 59.864C267.691 56.28 266.881 53.1653 265.26 50.52C263.681 47.832 261.377 45.7627 258.348 44.312ZM250.988 74.2C248.257 76.504 244.822 77.656 240.684 77.656H235.499L240.107 51.416H245.355C248.897 51.416 251.628 52.2907 253.548 54.04C255.467 55.7467 256.428 58.1787 256.428 61.336C256.428 62.1893 256.321 63.256 256.107 64.536C255.425 68.6747 253.718 71.896 250.988 74.2ZM296.144 78.68H281.808L288.271 42.072H277.327L269.392 87H294.672L296.144 78.68ZM315.635 60.056L317.236 50.712H333.811L335.348 42.072H307.827L299.891 87H327.411L328.948 78.36H312.372L314.163 68.312H328.82L330.292 60.056H315.635ZM371.445 45.272C369.012 43.1387 365.471 42.072 360.82 42.072H342.452L334.516 87H345.46L348.469 70.04H351.092L357.428 87H369.781L362.549 69.208C366.047 68.2267 368.842 66.5627 370.932 64.216C373.023 61.8693 374.324 59.2027 374.837 56.216C375.007 55.3627 375.092 54.4453 375.092 53.464C375.092 50.0933 373.876 47.3627 371.445 45.272ZM363.764 55.32C363.764 55.5333 363.722 55.9813 363.637 56.664C363.295 58.456 362.527 59.8427 361.333 60.824C360.18 61.8053 358.602 62.296 356.596 62.296H349.812L351.797 51.032H358.581C360.287 51.032 361.567 51.416 362.421 52.184C363.316 52.9093 363.764 53.9547 363.764 55.32Z" fill="#9FABD5"/>
+<svg width="438" height="130" viewBox="0 0 438 130" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M53.2625 84.44H77.3265L76.8145 87H49.4225L49.8705 84.568L80.5265 44.696H57.4865L57.9985 42.072H84.3025L83.8545 44.568L53.2625 84.44ZM94.9815 44.44L91.6535 63.32H109.574L109.126 65.624H91.2695L87.8775 84.632H107.718L107.27 87H84.5495L92.5495 42.072H115.206L114.757 44.44H94.9815ZM126.867 42.072L118.867 87H115.987L123.987 42.072H126.867ZM162.193 42.072L161.745 44.44H148.945L141.457 87H138.577L146.065 44.44H133.265L133.713 42.072H162.193Z" fill="#002C4D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M393 30H169V99H393V30ZM194.312 79.064H211.08L212.36 87H223.944L215.624 42.072H202.952L178.76 87H190.216L194.312 79.064ZM207.176 54.104L209.8 70.744H198.6L207.176 54.104ZM264.348 44.312C261.361 42.8187 257.798 42.072 253.66 42.072H236.827L228.891 87H245.724C250.417 87 254.705 86.0613 258.588 84.184C262.513 82.3067 265.734 79.6613 268.252 76.248C270.812 72.8347 272.476 68.9307 273.243 64.536C273.542 62.6587 273.691 61.1013 273.691 59.864C273.691 56.28 272.881 53.1653 271.26 50.52C269.681 47.832 267.377 45.7627 264.348 44.312ZM256.988 74.2C254.257 76.504 250.822 77.656 246.684 77.656H241.499L246.107 51.416H251.355C254.897 51.416 257.628 52.2907 259.548 54.04C261.467 55.7467 262.428 58.1787 262.428 61.336C262.428 62.1893 262.321 63.256 262.107 64.536C261.425 68.6747 259.718 71.896 256.988 74.2ZM302.143 78.68H287.808L294.271 42.072H283.327L275.392 87H300.672L302.143 78.68ZM321.635 60.056L323.236 50.712H339.811L341.348 42.072H313.827L305.891 87H333.411L334.948 78.36H318.372L320.163 68.312H334.82L336.292 60.056H321.635ZM377.445 45.272C375.012 43.1387 371.471 42.072 366.82 42.072H348.452L340.516 87H351.46L354.469 70.04H357.092L363.428 87H375.781L368.549 69.208C372.047 68.2267 374.842 66.5627 376.932 64.216C379.023 61.8693 380.324 59.2027 380.837 56.216C381.007 55.3627 381.092 54.4453 381.092 53.464C381.092 50.0933 379.876 47.3627 377.445 45.272ZM369.764 55.32C369.764 55.5333 369.722 55.9813 369.637 56.664C369.295 58.456 368.527 59.8427 367.333 60.824C366.18 61.8053 364.602 62.296 362.596 62.296H355.812L357.797 51.032H364.581C366.287 51.032 367.567 51.416 368.421 52.184C369.316 52.9093 369.764 53.9547 369.764 55.32Z" fill="#1395F8"/>
 </svg>

src/index.js

@@ -15,13 +15,13 @@ root.render(
         theme={{
           token: {
             fontFamily: "Roboto, sans-serif",
-            colorPrimary: "#6878d6",
-            colorInfo: "#6878d6",
+            colorPrimary: "#1395f8",
+            colorInfo: "#1395f8",
           },
           components: {
             Segmented: {
               // used in sign up
-              itemSelectedBg: "#6878d6",
+              itemSelectedBg: "#1395f8",
               itemSelectedColor: "#fff",
             },
           },

src/utils.js

@@ -46,7 +46,7 @@ export const Constants = {
   ROUTE_PATHS: {
     AUTHENTICATION: {
       LOGIN: "/login",
-      SIGN_UP: "/buy",
+      SIGN_UP: "/signup",
       FORGOT_PASSWORD: "/forgot-password",
       CHECKOUT_SUCCESS: "/checkout/success",
       CHECKOUT_CANCELED: "/checkout/canceled",
@@ -121,7 +121,7 @@ export const AppStyle = {
     margin: 12,
   },
   colors: {
-    primary: "#6878d6",
+    primary: "#1395f8",
   },
 };