diff --git a/app/about-us/AboutText.js b/app/about-us/AboutText.js index 179a7b9..4e645d9 100644 --- a/app/about-us/AboutText.js +++ b/app/about-us/AboutText.js @@ -1,4 +1,5 @@ import React from "react"; +import Image from "next/image"; import Design from "../assets/images/design.png"; import Approach from "../assets/images/approach.png"; @@ -17,7 +18,7 @@ function ServiceItem(props) { style={{ cursor: "default" }} >
- icon + icon

{props.title}

{props.description}

diff --git a/app/about-us/page.tsx b/app/about-us/page.tsx index 2bf9134..55026dd 100644 --- a/app/about-us/page.tsx +++ b/app/about-us/page.tsx @@ -1,11 +1,10 @@ -"use client" import React from 'react' -import useToggle from '../Hooks/useToggle'; +import HomeNav from '../components/navigation/HomeNav'; import FooterHomeOne from '../components/FooterHomeOne'; import HeroAbout from './HeroAbout'; import ServicesAbout from './ServicesAbout'; import AboutTextComponent from './AboutText'; -import HeaderAbout from './HeaderAbout'; +import BackToTop from '../components/BackToTop' // must be a better way to centralize the style = TEMPORARY USE import '../assets/css/bootstrap.min.css'; @@ -18,16 +17,15 @@ import '../assets/css/style.css'; function page() { - const [drawer, drawerAction] = useToggle(false); return ( <> -
Abouut us Here
- {/* */} + + ) diff --git a/app/assets/css/main.css b/app/assets/css/main.css index 8b9ad18..0a2f972 100644 --- a/app/assets/css/main.css +++ b/app/assets/css/main.css @@ -2269,7 +2269,7 @@ p { .appie-page-title-area { height: 250px; - background-image: url(../images/service-back.jpg); + background-image: url(/assets/images/service-back.jpg); background-size: cover; background-position: center; background-repeat: no-repeat; @@ -2278,7 +2278,7 @@ p { } .appie-page-title-area.appie-page-service-title-area { height: 400px; - background-image: url(../images/service-back.jpg); + background-image: url(/assets/images/service-back.jpg); } @media only screen and (min-width: 768px) and (max-width: 991px) { .appie-page-title-area.appie-page-service-title-area { @@ -6642,7 +6642,7 @@ blockquote cite { opacity: 2.9; } .appie-about-page-content a { - color: red; + color: red !important; border: 2px solid #fff; border-radius: 10px; padding: 0px 10px; @@ -6654,7 +6654,7 @@ blockquote cite { } .appie-about-page-content a:hover { background: #fff; - color: #2b70fa; + color: #2b70fa !important; } .appie-about-page-content::before { position: absolute; @@ -6663,7 +6663,7 @@ blockquote cite { top: -710px; height: 645px; width: 80vw; - background-image: url(../images/about-us-main.jpg); + background-image: url(/assets/images/about-us-main.jpg); background-size: cover; background-position: center; background-repeat: no-repeat; diff --git a/app/components/BackToTop.js b/app/components/BackToTop.js new file mode 100644 index 0000000..008a855 --- /dev/null +++ b/app/components/BackToTop.js @@ -0,0 +1,20 @@ +"use client" +import React, { useEffect } from 'react'; +import TopToBottom from '../lib/TopToBottom'; + +function BackToTop({ className }) { + useEffect(() => { + TopToBottom('.back-to-top'); + }); + return ( + <> +
+ + + +
+ + ); +} + +export default BackToTop; diff --git a/app/components/HomeOne.js b/app/components/HomeOne.js index c667db3..c88f1e2 100644 --- a/app/components/HomeOne.js +++ b/app/components/HomeOne.js @@ -1,5 +1,4 @@ import React from 'react'; -// import BackToTop from '../BackToTop'; import HomeNav from './navigation/HomeNav' import BlogHomeOne from './BlogHomeOne'; // import FeaturesHomeOne from './FeaturesHomeOne'; @@ -11,6 +10,7 @@ import TrafficHomeTwo from './TrafficHomeTwo'; //import FeaturedScreen from './FeaturedScreen'; import AfterHero from './AfterHero'; import NextAfterHero from './NextAfterHero'; +import BackToTop from './BackToTop'; @@ -28,6 +28,7 @@ function HomeOne() { + ); } diff --git a/app/components/News/HeroNews.js b/app/components/News/HeroNews.js index 01a849f..577d52e 100644 --- a/app/components/News/HeroNews.js +++ b/app/components/News/HeroNews.js @@ -1,5 +1,4 @@ import React from 'react'; -import { Link } from 'react-router-dom'; function HeroNews({ title, breadcrumb }) { return ( @@ -14,7 +13,7 @@ function HeroNews({ title, breadcrumb }) {
    {breadcrumb.map((value) => (
  1. - {value.title} + {value.title}
    2. ))}
diff --git a/app/components/navigation/ServiceNav.js b/app/components/navigation/ServiceNav.js new file mode 100644 index 0000000..1108186 --- /dev/null +++ b/app/components/navigation/ServiceNav.js @@ -0,0 +1,20 @@ +"use client" +import React, {useEffect} from 'react' +import useToggle from '../../Hooks/useToggle' +import Drawer from '../../Mobile/Drawer' +import Services from './Services' +import StickyMenu from '../../lib/StickyMenu'; + + +export default function ServiceNav() { + const [drawer, drawerAction] = useToggle(false); + useEffect(() => { + StickyMenu(); + }); + return ( + <> + + + + ) +} diff --git a/app/components/navigation/Services.js b/app/components/navigation/Services.js new file mode 100644 index 0000000..c6db37f --- /dev/null +++ b/app/components/navigation/Services.js @@ -0,0 +1,50 @@ +import React from 'react'; +import logo from '../../assets/images/wrenchboard-logo-text.png'; +import Navigation from './Navigation'; +import Image from 'next/image'; + +function Services({ action }) { + + return ( + <> +
+
+
+
+
+
+ + WrenchBoard + +
+
+
+
+ +
+
+
+
+ + Login + + + Get Started + +
action(e)} + className="toggle-btn ml-30 canvas_open d-lg-none d-block" + > + +
+
+
+
+
+
+
+ + ); +} + +export default Services; diff --git a/app/service/ServiceSideMenu.js b/app/service/ServiceSideMenu.js new file mode 100644 index 0000000..7ca7929 --- /dev/null +++ b/app/service/ServiceSideMenu.js @@ -0,0 +1,83 @@ +import React from 'react'; +import Image from 'next/image'; +import AboutIcon from '../assets/images/icon/about-us.ico' +import HomeIcon from '../assets/images/icon/home-icon.ico' +import UseCaseIcon from '../assets/images/icon/use-case.ico' +import PrivacyIcon from '../assets/images/icon/privacy-policy.ico' +import TermsIcon from '../assets/images/icon/term-and-conditions.ico' + + +function ServiceSideMenu() { + + return ( + <> + + + + + ); +} + +export default ServiceSideMenu; diff --git a/app/service/ServiceTopart.js b/app/service/ServiceTopart.js new file mode 100644 index 0000000..e2dd068 --- /dev/null +++ b/app/service/ServiceTopart.js @@ -0,0 +1,50 @@ +import React from 'react'; +import ServiceSideMenu from './ServiceSideMenu'; + +function ServiceTopart() { + + return ( + <> +
+
+
+
+ +
+
+
+
+

What we do.

+

+ WrenchBoard is where you set goals and reward accomplishments or find somebody to perform a needed task. +

+ {/*
*/} + {/*

*/} + {/* /!*An open-platform for you to build your self - image, skills set, branded personality,*!/*/} + {/* /!*carve a network and ofcourse an income flow with ease and satisfaction of self - actualization and accomplishments.*!/*/} + {/*

*/} + {/*

*/} + {/* A major task done by skilled professional with personal touch and completed within the twinkling of an eye in specified time-frame.*/} + {/*

*/} +
+

+ WrenchBoard is the marketplace that allows users to raise their hands and gives you the power to select who you want to perform your task. +

+
+

+ Our commitment to quality ensures that WrenchBoard.com remains a trusted platform for reliable transaction and redspectable partnerships. +

+
+ Do more at < a href ={process.env.REACT_APP_DASH_URL_LOGIN} >WrenchBoard + +
+
+
+
+
+
+ + ); +} + +export default ServiceTopart; diff --git a/app/service/page.tsx b/app/service/page.tsx index 2d9edd7..9a8b40d 100644 --- a/app/service/page.tsx +++ b/app/service/page.tsx @@ -1,5 +1,8 @@ import React from 'react' import FooterHomeOne from '../components/FooterHomeOne'; +import ServiceNav from '../components/navigation/ServiceNav' +import HeroNews from '../components/News/HeroNews' +import ServiceTopart from './ServiceTopart' // must be a better way to centralize the style = TEMPORARY USE import '../assets/css/bootstrap.min.css'; @@ -14,8 +17,18 @@ import '../assets/css/style.css'; function page() { return ( <> -
Service Here
+ + + + {/* */} + {/* */} ) diff --git a/public/assets/images/about-us-main.jpg b/public/assets/images/about-us-main.jpg new file mode 100644 index 0000000..c138cac Binary files /dev/null and b/public/assets/images/about-us-main.jpg differ diff --git a/public/assets/images/service-back.jpg b/public/assets/images/service-back.jpg new file mode 100644 index 0000000..aa0122b Binary files /dev/null and b/public/assets/images/service-back.jpg differ