feat: add ergo colors, remove dropdown, and set ergo as default

index.html

@@ -14,7 +14,7 @@
   <meta property="og:image" content="/og-image.png">
   <link rel="apple-touch-icon" href="/apple-touch-icon.png"/>
   <link rel="manifest" href="/manifest.json"/>
-  <title>Spectrum</title>
+  <title>ErgoDEX</title>
   <style>
     #app { height: 100% }
     #app > div { height: 100% }

src/App.tsx

@@ -10,11 +10,10 @@ import { ApplicationRoutes, routesConfig } from './ApplicationRoutes';
 import { useObservable } from './common/hooks/useObservable';
 import { analyticsInitializer } from './common/initializers/analyticsInitializer';
 import { gaInitializer } from './common/initializers/gaInitializer';
-import { networkDomInitializer } from './common/initializers/networkDomInitializer';
+import { networkDomInitializer } from './common/initializers/networkDomInitializer.ts';
 import { sentryInitializer } from './common/initializers/sentryInitializer';
-import { SelectDefaultNetwork } from './common/services/NetworkDomManager/SelectDefaultNetwork/SelectDefaultNetwork';
+import { SelectDefaultNetwork } from './common/services/NetworkDomManager/SelectDefaultNetwork/SelectDefaultNetwork.tsx';
 import { startAppTicks } from './common/streams/appTick';
-import { Glow } from './components/common/Layout/Glow/Glow';
 import { ErrorEventProvider } from './components/ErrorBoundary/ErrorEventProvider';
 import { AppLoadingProvider, useApplicationSettings } from './context';
 import { useBodyClass } from './hooks/useBodyClass';
@@ -77,7 +76,6 @@ export const ApplicationInitializer: React.FC = () => {
       <ErrorEventProvider>
         <BrowserRouter>
           <LanguageProvider>
-            <Glow />
             <SelectDefaultNetwork>
               {isAppInitialized && <Application />}
             </SelectDefaultNetwork>

src/ApplicationRoutes.tsx

@@ -1,14 +1,10 @@
-import { fireAnalyticsEvent, getBrowser, user } from '@spectrumlabs/analytics';
-import { DateTime } from 'luxon';
-import { FC, useEffect } from 'react';
+import { FC } from 'react';
 import { Navigate, Outlet, useRoutes } from 'react-router-dom';
 
-import { version } from '../package.json';
 import { NetworkDomManager } from './common/services/NetworkDomManager/NetworkDomManager';
 import { Layout } from './components/common/Layout/Layout';
 import { RouteConfigExtended } from './components/RouterTitle/RouteConfigExtended';
 import { RouterTitle } from './components/RouterTitle/RouterTitle';
-import { useApplicationSettings } from './context';
 import { AddLiquidity } from './pages/AddLiquidity/AddLiquidity';
 import { CreatePool } from './pages/CreatePool/CreatePool';
 import { Farms } from './pages/Farms/Farms';
@@ -136,43 +132,15 @@ export const routesConfig: RouteConfigExtended[] = [
 
 export const ApplicationRoutes: FC = () => {
   const routes = useRoutes(routesConfig);
-  const networkTitle = NetworkDomManager.useNetworkTitle();
-
-  const [settings] = useApplicationSettings();
-
-  useEffect(() => {
-    fireAnalyticsEvent('App Loaded');
-
-    setUserDefaultProps();
-    setUserCohort();
-
-    user.set('theme_active', settings.theme);
-    user.set('locale_active', settings.lang);
-  }, []);
 
   return (
     <>
       <RouterTitle
         divider="·"
-        pageTitle={networkTitle ? `Spectrum · ${networkTitle}` : 'Spectrum'}
+        pageTitle={'ErgoDEX'}
         routesConfig={routesConfig}
       />
       {routes}
     </>
   );
 };
-
-function setUserDefaultProps(): void {
-  user.set('browser', getBrowser());
-  user.set('user_agent', navigator.userAgent);
-  user.set('screen_resolution_height', window.screen.height);
-  user.set('screen_resolution_width', window.screen.width);
-}
-
-function setUserCohort(): void {
-  user.setOnce('cohort_date', DateTime.now().toUTC().toFormat('yyyy.MM.dd'));
-  user.setOnce('cohort_day', DateTime.now().toUTC().ordinal);
-  user.setOnce('cohort_month', DateTime.now().toUTC().month);
-  user.setOnce('cohort_year', DateTime.now().toUTC().year);
-  user.setOnce('cohort_version', version);
-}

src/assets/styles/themes/dark.less

@@ -3,7 +3,15 @@
 
 .dark {
   .darkTheme();
-  --spectrum-glow-image: url("../../images/glow-v2.png");
+  --spectrum-primary-color: #FF5135;
+  --spectrum-primary-color-hover: #E5472D;
+  --spectrum-primary-color-focus: #E5472D;
+  --spectrum-primary-color-active: #E5472D;
+  --spectrum-connect-wallet-btn-border: #FF5135;
+  --spectrum-connect-wallet-btn-bg: rgba(255, 81, 53, 0.2);
+  --spectrum-connect-wallet-btn-color: #FF5135;
+  --spectrum-progress-bg-color: linear-gradient(90deg, #FF5135 0%, #ff9900 100%);
+
   --spectrum-glow-image-width: 689px;
   --spectrum-logo-color: var(--spectrum-primary-text);
   --spectrum-asset-box-border-color: #303030;

src/assets/styles/themes/light.less

@@ -2,7 +2,16 @@
 
 .light {
   .lightTheme();
-  --spectrum-glow-image: url("../../images/glow-v2.png");
+  --spectrum-primary-color: #FF5135;
+  --spectrum-primary-color-hover: #E5472D;
+  --spectrum-primary-color-focus: #E5472D;
+  --spectrum-primary-color-active: #E5472D;
+  --spectrum-connect-wallet-btn-border: #FF5135;
+  --spectrum-connect-wallet-btn-bg: rgba(255, 81, 53, 0.2);
+  --spectrum-connect-wallet-btn-color: #FF5135;
+  --spectrum-progress-bg-color: linear-gradient(90deg, #FF5135 0%, #ff9900 100%);
+
+
   --spectrum-glow-image-width: 689px;
   --spectrum-logo-color: var(--spectrum-primary-color);
   --spectrum-asset-box-border-color: #f0f0f0;

src/common/services/NetworkDomManager/SelectDefaultNetwork/SelectDefaultNetwork.tsx

@@ -1,12 +1,8 @@
-import { Flex, Typography, useDevice } from '@ergolabs/ui-kit';
-import { Trans } from '@lingui/macro';
-import { FC, ReactNode } from 'react';
+import { FC, ReactNode, useEffect } from 'react';
 import { BehaviorSubject, filter, first, tap } from 'rxjs';
 
 import { visibleNetworks } from '../../../../gateway/common/network';
 import { Network } from '../../../../network/common/Network';
-import { useObservable } from '../../../hooks/useObservable';
-import { SelectDefaultNetworkItem } from './SelectDefaultNetworkItem/SelectDefaultNetworkItem';
 
 export const isSelectDefaultNetworkVisible$ = new BehaviorSubject<boolean>(
   false,
@@ -32,47 +28,10 @@ export interface SelectDefaultNetworkProps {
 export const SelectDefaultNetwork: FC<SelectDefaultNetworkProps> = ({
   children,
 }) => {
-  const { valBySize } = useDevice();
-  const [isSelectDefaultNetworkVisible] = useObservable(
-    isSelectDefaultNetworkVisible$,
-    [],
-    false,
-  );
-  const onNetworkClick = (network: Network<any, any>) => {
-    manuallySelectedNetworkUpdate$.next(network);
-  };
-
-  if (isSelectDefaultNetworkVisible) {
-    return (
-      <Flex width="100%" stretch justify="center" style={{ padding: '1rem' }}>
-        <Flex.Item
-          display="flex"
-          marginTop={valBySize(10, 38)}
-          width={524}
-          align="center"
-          col
-        >
-          <Typography.Title level={2}>
-            <Trans>Select Network</Trans>
-          </Typography.Title>
-          <Flex.Item marginTop={valBySize(5, 10)} display="flex" width="100%">
-            {visibleNetworks.map((network, index) => (
-              <Flex.Item
-                marginRight={
-                  index !== visibleNetworks.length - 1 ? valBySize(5, 10) : 0
-                }
-                onClick={() => onNetworkClick(network)}
-                key={network.label}
-                flex={1}
-              >
-                <SelectDefaultNetworkItem network={network} />
-              </Flex.Item>
-            ))}
-          </Flex.Item>
-        </Flex.Item>
-      </Flex>
-    );
-  }
+  useEffect(() => {
+    const ergoNetwork = visibleNetworks.find((n) => n.name === 'ergo');
+    manuallySelectedNetworkUpdate$.next(ergoNetwork);
+  }, []);
 
   return <>{children}</>;
 };

src/components/common/AppLogo/AppLogo.tsx

@@ -2,7 +2,7 @@ import { CSSProperties } from 'react';
 import * as React from 'react';
 import { Link } from 'react-router-dom';
 
-import { ReactComponent as SplashLogo } from './splash-logo.svg';
+import { ReactComponent as SplashLogo } from './ergodex_logo.svg';
 
 interface AppLogoProps {
   isNoWording?: boolean;