#6, Add wallet subMenu

docker-compose.yml

@@ -17,6 +17,7 @@ services:
       - REGISTER_EMAIL_ADDRESS=$REGISTER_EMAIL_ADDRESS
       - REFERENCE_FIAT_CURRENCY=$WEB_APP_REFERENCE_FIAT_CURRENCY
       - CALENDAR_TYPE=$WEB_APP_CALENDAR_TYPE
+      - REDIRECT_URL=$WEB_APP_REDIRECT_URL
     networks:
       - default
     deploy:

env-map.js

@@ -13,5 +13,6 @@ window.env = {
     REACT_APP_SYSTEM_EMAIL_ADDRESS : "$REGISTER_EMAIL_ADDRESS",
     REACT_APP_REFERENCE_FIAT_CURRENCY : "$REFERENCE_FIAT_CURRENCY",
     REACT_APP_CALENDAR_TYPE : "$CALENDAR_TYPE",
+    REACT_APP_REDIRECT_URL : "$REDIRECT_URL",
 
 }

src/components/TextInput/TextInput.js

@@ -46,7 +46,7 @@ const TextInput = (props) => {
                 iconName={`${classes.iconInfo} text-white fs-0-6 flex`}
                 customClass="hint-icon"
             />
-            <div className="column pt-05">
+            <div className="column pt-05 fs-0-7">
                 { alerts.map((alert , index) => <span key={index} className={`${classes.alert} pr-05 `}>{alert}</span>) }
             </div>
         </div>

src/components/TextInput/TextInput.module.css

@@ -94,7 +94,7 @@
   justify-content: center;
 }
 .alert {
-  font-size: 0.7vw;
+  /*font-size: 0.7vw;*/
   color: var(--red);
   line-height:2.8vh;
 }

src/main/Browser/Browser.js

@@ -9,12 +9,16 @@ import useQuery from "../../Hooks/useQuery";
 import useInterval from "../../Hooks/useInterval";
 import {setLastPriceInitiate} from "../../store/actions/exchange";
 import FullWidthError from "../../components/FullWidthError/FullWidthError";
+import {useNavigate} from "react-router-dom";
 
 
 const Browser = () => {
     const dispatch = useDispatch();
+    const navigate = useNavigate();
+
     const query = useQuery();
 
+
     const isDark = useSelector((state) => state.global.isDark)
     const isLoading = useSelector((state) => state.global.isLoading)
     const hasError = useSelector((state) => state.global.hasError)
@@ -39,6 +43,18 @@ const Browser = () => {
     }, []);
 
 
+    const redirectURL = window.env.REACT_APP_REDIRECT_URL
+
+    const redirectFunc = () => {
+        window.location.replace(redirectURL);
+    };
+
+    useEffect(()=>{
+        redirectFunc()
+    }, [])
+
+
+
     useInterval(() => {
         dispatch(setUserAccountInfoInitiate());
     }, isLogin ? 3000 : null)
@@ -81,8 +97,16 @@ const Browser = () => {
     if (hasError) {
         return <FullWidthError/>
     }
+
+
+
+
     return (
-        <div className={`flex jc-center ai-center card-header-bg text-color fs-04`} style={{height: "100vh", direction:"ltr"}}>Open in Mobile ...</div>
+        <div className={`flex jc-center ai-center card-header-bg text-color fs-04`} style={{height: "100vh", direction:"ltr"}}>
+
+            Open in Mobile ...
+
+        </div>
     );
 };
 

src/main/Mobile/Pages/Login/Login.js

@@ -27,15 +27,15 @@ const Login = () => {
     return (
         <div className={`width-100 column col-100 ai-center jc-center px-1 ${classes.container} move-image`}
              style={{backgroundImage: `url("${images.spaceStar}")`}}>
-            <div className={`col-40 column ai-center jc-center ${classes.intro} move-image width-100`}>
+           {/* <div className={`col-40 column ai-center jc-center ${classes.intro} move-image width-100`}>
                 <div className={`column jc-center ai-center ${classes.bgicon}`}>
                     <img src={images.astronaut} alt="logo" className={`floating mb-2`}/>
                     <h2 className="mt-2">
                         {t('login.description')}
                     </h2>
                 </div>
-            </div>
-            <div className={`col-60 flex jc-center ai-center width-100`} style={{height: "100%"}}>
+            </div>*/}
+            <div className={`col-100 flex jc-center ai-center width-100`} style={{height: "100%"}}>
                 <div className={`${classes.content}`}>
                     <AccordionBox title={t('login.title')} content={data}/>
                 </div>

src/main/Mobile/Pages/Login/Login.module.css

@@ -48,8 +48,8 @@
     width: 75%;
 }
 
-.loginInput{
-    width: 75%;
+.loginInput {
+    width: 85%;
     margin-bottom: 1vh;
 }
 .loginInput > div{
@@ -84,7 +84,7 @@
 }
 
 .thisLoading{
-    width: 5vw;
+    width: 9vw;
 }
 
 .loginInput.otpInput :global(input){

src/main/Mobile/Pages/Login/components/ForgetPassword/ForgetPassword.js

@@ -91,7 +91,7 @@ const ForgetPassword = ({returnFunc}) => {
         if (captcha.image.value === undefined ) {
             return <span>{t('captchaAnswer')}</span>
         }
-        return <span style={{backgroundImage: `url("${captcha.image.value}")`}}/>
+        return <img src={captcha.image.value} className={`height-100`} alt={t('captchaAnswer')}/>
     }
 
 

src/main/Mobile/Pages/Login/components/LoginLoading/LoginFormLoading.js

@@ -4,7 +4,7 @@ import {connect} from "react-redux";
 
 const LoginFormLoading = ({isDark}) => {
     return <div className= "flex jc-center ai-center" style={{height: "35vh"}}>
-        <img style={{width: "2.5vw", textAlign: "center"}} src={isDark ? images.squareLoading : images.squareLoadingLight} alt="Loading"/>
+        <img style={{width: "8vw", textAlign: "center"}} src={isDark ? images.squareLoading : images.squareLoadingLight} alt="Loading"/>
     </div>
 }