Start page

src/AppRouters.jsx

@@ -24,6 +24,7 @@ import OnboardPage from "./views/OnboardPage";
 import AccPWDResetPage from './views/AccPWDResetPage';
 import ProfileCompletePage from './views/ProfileCompletePage';
 import SubscribePage from './views/Subscribe'
+import StartPage from "./views/StartPage";
 
 function AppRouters() {
     return (
@@ -44,6 +45,7 @@ function AppRouters() {
                     {/* protected routes */}
                     <Route element={<SocketIOContextProvider/>}>
                         <Route element={<UserExist/>}>
+                            <Route path={siteLinks.start} element={<StartPage/>}/>
                             <Route path={siteLinks.dash} element={<HomePage/>}/>
                             <Route path={siteLinks.profile_complete} element={<ProfileCompletePage/>}/>
                             <Route path={siteLinks.product} element={<ProductPage/>}/>

src/component/start/Start.jsx

@@ -0,0 +1,92 @@
+import React from "react";
+import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS";
+
+
+export default function Start(){
+
+    return(
+        <>
+            <BreadcrumbComBS title='Get Started...' paths={['Dashboard', 'Start']} />
+            <div className="row">
+                <div className="col-xl-3 col-md-6">
+                    <div className="card card-statistics text-center py-3">
+                        <div className="card-body pricing-content">
+                            {/*<div className="pricing-content-card">*/}
+                            {/*    <h5>Premium</h5>*/}
+                            {/*    <h2 className="text-primary pt-3">$150</h2>*/}
+                            {/*    <p className="text-primary pb-3">/ Monthly</p>*/}
+                            {/*    <ul className="py-2">*/}
+                            {/*        <li>post jobs</li>*/}
+                            {/*        <li>advanced instructors search</li>*/}
+                            {/*        <li>invite candidates</li>*/}
+                            {/*        <li>post events</li>*/}
+                            {/*        <li>cancel any time</li>*/}
+                            {/*    </ul>*/}
+                            {/*    <div className="pt-2"><a href="javascript:void(0)" className="btn btn-primary btn-round btn-sm">go premium</a></div>*/}
+                            {/*</div>*/}
+                        </div>
+                    </div>
+                </div>
+
+                <div className="col-xl-3 col-md-6">
+                    <div className="card card-statistics text-center py-3">
+                        <div className="card-body pricing-content">
+                            <div className="pricing-content-card">
+                                <h5>Start with</h5>
+                                <h2 className="text-primary pt-3" >Personal Website</h2>
+                                <ul className="py-2">
+                                    <li>post jobs</li>
+                                    <li>advanced instructors search</li>
+                                    <li>invite candidates</li>
+                                    <li>post events</li>
+                                    <li>cancel any time</li>
+                                </ul>
+                                <div className="pt-2"><a href="javascript:void(0)" className="btn btn-inverse-secondary btn-round btn-sm">go premium</a></div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div className="col-xl-3 col-md-6">
+                    <div className="card card-statistics text-center py-3">
+                        <div className="card-body pricing-content">
+                            <div className="pricing-content-card">
+                                <h5>Start with</h5>
+                                <h2 className="text-primary pt-3">Business Website</h2>
+                                <ul className="py-2">
+                                    <li>post jobs</li>
+                                    <li>advanced instructors search</li>
+                                    <li>invite candidates</li>
+                                    <li>post events</li>
+                                    <li>cancel any time</li>
+                                </ul>
+                                <div className="pt-2"><a href="javascript:void(0)" className="btn btn-inverse-secondary btn-round btn-sm">go premium</a></div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div className="col-xl-3 col-md-6">
+                    <div className="card card-statistics text-center py-3">
+                        <div className="card-body pricing-content">
+                            {/*<div className="pricing-content-card">*/}
+                            {/*    <h5>small</h5>*/}
+                            {/*    <h2 className="text-primary pt-3">$80</h2>*/}
+                            {/*    <p className="text-primary pb-3">/ Monthly</p>*/}
+                            {/*    <ul className="py-2">*/}
+                            {/*        <li>post jobs</li>*/}
+                            {/*        <li>advanced instructors search</li>*/}
+                            {/*        <li>invite candidates</li>*/}
+                            {/*        <li>post events</li>*/}
+                            {/*        <li>cancel any time</li>*/}
+                            {/*    </ul>*/}
+                            {/*    <div className="pt-2"><a href="javascript:void(0)" className="btn btn-inverse-secondary btn-round btn-sm">go premium</a></div>*/}
+                            {/*</div>*/}
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+        </>
+    )
+}

src/links/siteLinks.js

@@ -3,6 +3,7 @@ const siteLinks = {
     help: '/help',
     home: '/',
     dash: '/dash',
+    start: '/start',
     profile_complete: '/profile-complete',
     product: '/product/*',
     contacts: '/contacts',

src/views/StartPage.jsx

@@ -0,0 +1,7 @@
+
+import Start from "../component/start/Start";
+
+
+export default function StartPage(){
+    return <Start />
+}