Stepper Done

src/components/Stepper/index.css

@@ -0,0 +1,9 @@
+.giveMeEllipsis {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2; /* number of lines to show */
+    /* line-height: 1;        /* fallback */
+    /* max-height: 1*2;       fallback  */
+ }

src/components/Stepper/index.js

@@ -1,4 +1,6 @@
 import React, {useState} from "react";
+import separate from "../../utils/separate";
+import './index.css'
 
 function Stepper({
   direction,
@@ -39,7 +41,10 @@ function Stepper({
   : null             
            }
          </div>
-        <p className={`mr-4 font-bold ${item.active ? 'text-red26' : 'text-gray-400'} ${direction === 'horizontal' && 'text-xs' }`}>{item.title}</p>
+        <div className="flex justify-center items-center">
+          <p className="mr-3 ml-1 text-xl font-bold text-red-500 text-opacity-50">{index + 1}</p>
+        <p className={` giveMeEllipsis font-bold ${item.active ? 'text-red26' : 'text-gray-400'} ${direction === 'horizontal' && 'text-xs' }`}> {item.title}</p>
+          </div>
          </div>
          {count !== (Number(index) + 1) && (
            <span

src/components/input/index.js

@@ -51,7 +51,7 @@ const Input = ({
                 type={type ? type : 'text'}
                 name="Login-box-form-item-input-name"
                 id={`Login-box-form-item-input-name${id}`}
-                className={`Login-box-form-item-input w-full h-full  px-4 outline-0 rounded-lg text-red52`}
+                className={`Login-box-form-item-input w-full h-full  px-4 outline-0 rounded-lg text-gray-700 focus:text-red52`}
                 style={{ direction: direction ? direction : "ltr", backgroundColor: bg }}
                 onFocus={() => focusHandler(id ? id : 0)}
                 onBlur={() => blurHandler(id ? id : 0)}

src/redux/reducers/userProduct.js

@@ -33,9 +33,9 @@ export default function userFactor(state = initialState, action) {
     case "userProduct/update":
       return { ...state, loading: false, error: null };
     case "userProduct/add":
-      if (window.location.pathname.indexOf("products") !== -1) {
+     
         toast.success("درخواست شما با موفقیت انجام شد.");
-      }
+      
       return { ...state, loading: false, error: null, sum: data.payPrice };
     case "userProduct/delete":
       return { ...state, loading: false, error: null };

src/utils/separate.js

@@ -0,0 +1,12 @@
+const separate = (number) => {
+  number += "";
+  number = number.replace(",", "");
+  let x = number.split(".");
+  let y = x[0];
+  let z = x.length > 1 ? "." + x[1] : "";
+  let rgx = /(\d+)(\d{3})/;
+  while (rgx.test(y)) y = y.replace(rgx, "$1" + "," + "$2");
+  return y + z;
+};
+
+export default separate;

src/view/contact/index.js

@@ -52,7 +52,15 @@ const ContactUs = ({isMobile}) => {
 
                 <form className="flex flex-col w-full">
                     <Input title='نام' gapSize='8' id={0} style={{ width: '100%' }} />
-                    <Input title='ایمیل' gapSize='8' id={1} style={{ width: '100%', background: 'rgba(249, 249, 249, 0.75)' }} />
+                    <Input title='ایمیل' gapSize='8' id={1} style={{ width: '100%', background: 'rgba(249, 249, 249, 0.75)' }} type="email" onChange={(e) => {
+  let value = e.target.value
+
+  value = value.replace(/[^A-Za-z]/ig, '')
+
+  this.setState({
+    value,
+  })
+}}/>
                     <select className="bg-white border border-solid border-gray-200 w-full my-4 p-3 rounded-lg text-gray-400 outline-red52">
                         {departments.map((item, index) => (
                             <option key={`Grade__${index}`}>{item.title}</option>
@@ -114,7 +122,15 @@ const ContactUs = ({isMobile}) => {
 
                     <form className="flex flex-col w-full">
                         <Input title='نام' gapSize='8' id={0} style={{ width: '100%' }} />
-                        <Input title='ایمیل' gapSize='8' id={1} style={{ width: '100%' }} />
+                        <Input title='ایمیل' type={'email'} gapSize='8' id={1} style={{ width: '100%' }} onChange={(e) => {
+  let value = e.target.value
+
+  value = value.replace(/[^A-Za-z]/ig, '')
+
+  this.setState({
+    value,
+  })
+}} />
                         <select className="bg-white border border-solid border-gray-200 w-full my-4 p-3 rounded-lg text-gray-400 outline-red52">
                             {departments.map((item, index) => (
                                 <option key={`Grade__${index}`}>{item.title}</option>

src/view/services/index.js

@@ -389,7 +389,7 @@ const Services = ({
             ))}
             {
               gameId == 6 &&
-              <div className="w-3/4 p-8 py-10 flex mt-10 justify-between items-center border-2 rounded-xl border-red52 " >
+              <div className="w-3/4 p-8 py-10 flex mt-10 justify-between text-right items-center border-2 rounded-xl border-red52 " >
 
                 <div className="w-1/5">
                   <h1 className="text-red26 font-bold">افزایش مبلغ دلخواه</h1>