Skip to content

Commit a75c875

Browse files
muhammadasif-csemuhammadasif-cse
authored
Merge pull request #10 from muhammadasif-wd/dev
Dev
2 parents 614e799 + edc95af commit a75c875

28 files changed

+1205
-807
lines changed

‎package-lock.json

Lines changed: 20 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,8 @@
2323
"react": "^18.2.0",
2424
"react-dom": "^18.2.0",
2525
"react-icons": "^4.12.0",
26-
"react-router-dom": "^6.20.1"
26+
"react-router-dom": "^6.20.1",
27+
"swiper": "^11.0.5"
2728
},
2829
"devDependencies": {
2930
"@iconify/react": "^4.1.1",

‎src/App.jsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { Route, Routes } from 'react-router';
33
import Header from './components/header/Navbar';
44
import publicRoutes from './routes/publicRoutes';
55
import Loading from './shared/Loading';
6+
import Footer from './components/header/Footer';
67

78
function App() {
89
return (
@@ -15,6 +16,7 @@ function App() {
1516
})}
1617
</Routes>
1718
</main>
19+
<Footer />
1820
</Suspense>
1921
);
2022
}

‎src/assets/arrow.svg

Lines changed: 4 additions & 0 deletions
Loading

‎src/assets/banner.jpeg

108 KB
Loading

‎src/assets/home/map.png

971 KB
Loading

‎src/components/about/AboutTrusted.jsx

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import React from 'react'
2+
import Title from '../../shared/Title'
3+
import Subtitle from '../../shared/Subtitle'
4+
5+
export default function AboutTrusted() {
6+
return (
7+
<main className="bg-dark/5 text-dark">
8+
<div className="container mx-auto p-10">
9+
<Title title={`About Us`} styles={`font-bold`} />
10+
<div className="w-full md:w-1/2 flex flex-col gap-3">
11+
<Subtitle subtitle={`Welcome to Simpleflow,`} styles={`font-semibold mt-5`} />
12+
<p>your partner in comprehensive software solutions. Our mission is to empower businesses through cutting-edge technology and compelling design. We are dedicated to providing innovative solutions that address the unique challenges of the digital landscape.</p>
13+
<p>Whether its developing robust software solutions or creating dynamic websites, Simple Flow is committed to excellence. We leverage our expertise in software and website development to bring your ideas to life, ensuring they not only meet but exceed your expectations.</p>
14+
</div>
15+
</div>
16+
</main>
17+
)
18+
}

‎src/components/about/AboutVideo.jsx

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
import React from 'react'
2+
import DefaultButton from '../../shared/DefaultButton'
3+
import { images } from '../../shared/images'
4+
import { Icon } from '@iconify/react'
5+
import { Image, useDisclosure } from '@nextui-org/react'
6+
import DefaultModal from '../../shared/DefaultModal'
7+
8+
export default function AboutVideo() {
9+
const { isOpen, onOpen, onOpenChange } = useDisclosure();
10+
11+
return (
12+
<main className='my-10 bg-primaryColor w-11/12 mx-auto'>
13+
<section className='relative'>
14+
<Image radius='none' className='brightness-50 w-[100vw] object-cover opacity-50 h-[25rem]' src={images.about_bg} alt="" />
15+
<div className='justify-center flex items-center'>
16+
<div className='absolute z-30 top-40'>
17+
<DefaultButton event={onOpen} name={<Icon className='w-10 h-10' icon="ph:play-bold" />} styles={'rounded-full !w-20 !h-20'} />
18+
</div>
19+
</div>
20+
</section>
21+
22+
{/* modal */}
23+
<DefaultModal
24+
isOpen={isOpen}
25+
size={`full`}
26+
title={false}
27+
body={
28+
<iframe
29+
className='w-full h-[90vh]'
30+
src="https://www.youtube.com/embed/3sdpkFZUhlA?si=NR17DPqlTvaoDQ2U&amp;start=11&autoplay=1"
31+
title="YouTube video player"
32+
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
33+
allowfullscreen
34+
>
35+
</iframe>
36+
}
37+
onOpenChange={onOpenChange}
38+
footer={
39+
{ "close": false, "closeName": 'close', "action": false, "actionName": 'Done' }
40+
}
41+
/>
42+
</main>
43+
);
44+
}

‎src/components/about/Progress.jsx

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
import React, { Suspense } from 'react';
2+
import Loading from '../../shared/Loading';
3+
import { Progress } from "@nextui-org/react";
4+
5+
6+
export default function ProgressBar() {
7+
return (
8+
<main>
9+
<Suspense fallback={<Loading />}>
10+
<div className='flex justify-around mt-11'>
11+
<div className='w-1/2 flex justify-center '>
12+
<img className='w-4/5' src="https://demo.themefisher.com/agen-bootstrap/images/about/about-us.png" alt="" />
13+
</div>
14+
<div className='w-1/2 space-y-4'>
15+
<Progress
16+
label="HTML5 EXPERTISE"
17+
size="sm"
18+
value={8000}
19+
maxValue={10000}
20+
color='warning'
21+
formatOptions={{
22+
style: "currency",
23+
currency: "ARS"
24+
}}
25+
showValueLabel={false}
26+
/>
27+
<Progress
28+
label="JQUERY EXPERTISE"
29+
size="sm"
30+
value={6500}
31+
maxValue={10000}
32+
color="warning"
33+
formatOptions={{
34+
style: "currency",
35+
currency: "ARS"
36+
}}
37+
showValueLabel={false}
38+
className="max-w-md"
39+
/>
40+
<Progress
41+
label="PHP EXPERTISE"
42+
size="sm"
43+
value={6900}
44+
maxValue={10000}
45+
color="warning"
46+
formatOptions={{
47+
style: "currency",
48+
currency: "ARS"
49+
}}
50+
showValueLabel={false}
51+
className="max-w-md"
52+
/>
53+
<Progress
54+
label="USER INTERFACE EXPERTISE"
55+
size="sm"
56+
value={8900}
57+
maxValue={10000}
58+
color="warning"
59+
formatOptions={{
60+
style: "currency",
61+
currency: "ARS"
62+
}}
63+
showValueLabel={false}
64+
className="max-w-md"
65+
/>
66+
</div>
67+
</div>
68+
</Suspense>
69+
</main>
70+
)
71+
}
72+
73+

‎src/components/about/Slider.jsx

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import React, { Suspense, lazy } from 'react';
2+
import { Swiper, SwiperSlide } from 'swiper/react';
3+
import { EffectFlip, Navigation } from 'swiper/modules';
4+
import { images } from '../../shared/images';
5+
const Loading = lazy(() => import('../../shared/Loading'))
6+
import 'swiper/css';
7+
import 'swiper/css/effect-flip';
8+
import 'swiper/css/navigation';
9+
import { Image } from '@nextui-org/react';
10+
import slider_info from '../../data/home/slider_info';
11+
import HeadingText from '../../shared/HeadingText';
12+
13+
14+
const Slider = () => {
15+
return (
16+
<Suspense fallback={<Loading />}>
17+
<div style={{ backgroundImage: `url(${images.about_banner})`, backgroundRepeat: 'no-repeat' }} className='relative'>
18+
<div className='bg-primaryColor'>
19+
<HeadingText
20+
heading={`Our Client Testimonials`}
21+
subheading={`See our valuable client review`}
22+
styles={`py-10 text-white`}
23+
/>
24+
<div className='w-1/2 mx-auto pb-10'>
25+
<Swiper
26+
effect={'flip'}
27+
grabCursor={true}
28+
navigation={true}
29+
modules={[EffectFlip, Navigation]}
30+
className="mySwiper"
31+
>
32+
<div>
33+
{slider_info?.map((info, index) =>
34+
<SwiperSlide key={index}>
35+
<div className='bg-white text-center p-5 '>
36+
<div className='flex justify-center'>
37+
<Image className='rounded-full' src={info.img} alt="" />
38+
</div>
39+
<h4 className="text-xl font-bold py-2">{info.name}</h4>
40+
<p className='pb-2'>{info.description}</p>
41+
</div>
42+
</SwiperSlide>
43+
)}
44+
</div>
45+
</Swiper>
46+
</div>
47+
</div>
48+
</div>
49+
</Suspense>
50+
);
51+
};
52+
53+
export default Slider;

‎src/components/header/Footer.jsx

Lines changed: 55 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,60 @@
1+
import { Icon } from '@iconify/react';
2+
import { Link } from '@nextui-org/react';
13
import React from 'react';
4+
import { images } from '../../shared/images';
5+
import { footer_items } from '../../data/home/footer_items';
6+
import Subtitle from '../../shared/Subtitle';
27

38
const Footer = () => {
4-
return <div>hallo Footer</div>;
9+
return (
10+
<footer className="bg-primaryColor w-full">
11+
<section style={{ backgroundImage: `url(${images.map})`, backgroundRepeat: 'no-repeat' }} className="bg-cover">
12+
<div className="w-11/12 mx-auto pt-10 flex flex-col justify-center items-center">
13+
{footer_items.map(({ _id, followUsMessage, aboutCompany, facebookURL, contactNumber, linkedinURL, location, locationURL, twitterURL, youtubeURL }) => (
14+
<div key={_id} className="mx-auto w-full max-w-screen-xl">
15+
<div className="grid gap-10 lg:grid-cols-3 md:grid-cols-2 grid-cols-1 mx-auto text-white">
16+
<article>
17+
<Subtitle subtitle={`Simple Flow`} styles={`font-bold`} />
18+
<p className="my-8 text-justify">{aboutCompany}</p>
19+
</article>
20+
<article>
21+
<Subtitle subtitle={`Follow Us`} styles={`font-bold`} />
22+
<div className="text-sm font-medium">
23+
<p className="mt-8 text-justify">{followUsMessage}</p>
24+
<div className="flex items-center gap-3 mt-3">
25+
<Link target='_blank' className='text-white' href={facebookURL}><Icon className="w-6 h-6" icon="bi:facebook" /></Link>
26+
<Link target='_blank' className='text-white' href={youtubeURL}><Icon className="w-8 h-8" icon="bi:youtube" /></Link>
27+
<Link target='_blank' className='text-white' href={twitterURL}><Icon className="w-6 h-6" icon="bi:twitter-x" /></Link>
28+
<Link target='_blank' className='text-white' href={linkedinURL}><Icon className="w-6 h-6" icon="bi:linkedin" /></Link>
29+
</div>
30+
</div>
31+
</article>
32+
<article>
33+
<Subtitle subtitle={`Location`} styles={`font-bold`} />
34+
<div className='mt-8'>
35+
<article className="text-white gap-3 flex items-center justify-start my-3">
36+
<Icon className="w-8 h-8" icon="mdi:location" />
37+
<Link className='text-white' href={locationURL}>{location}</Link>
38+
</article>
39+
<article className="text-white gap-3 flex items-center justify-start ml-3">
40+
<Icon className="w-6 h-6" icon="bi:telephone-fill" />
41+
<p className="text-start">{contactNumber}</p>
42+
</article>
43+
</div>
44+
</article>
45+
</div>
46+
</div>
47+
))}
48+
<p className='text-center my-3'>
49+
<small className="text-white text-center">
50+
Copyright &copy; 2023 a theme by
51+
<span className="text-secondaryColor font-bold">Team Grofix</span>
52+
</small>
53+
</p>
54+
</div>
55+
</section>
56+
</footer>
57+
);
558
};
659

7-
export default Footer;
60+
export default Footer;

‎src/components/header/Navbar.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ const Header = () => {
9898
</Link>
9999
</NavbarItem>
100100
<NavbarItem>
101-
<Link className="p-0 text-base bg-transparent data-[hover=true]:bg-transparent text-white font-medium" href="/contacts">
101+
<Link className="p-0 text-base bg-transparent data-[hover=true]:bg-transparent text-white font-medium" href="/contact">
102102
Contact
103103
</Link>
104104
</NavbarItem>

‎src/components/home/News.jsx renamed to ‎src/components/home/Events.jsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,24 @@
11
import React from 'react';
22
import HeadingText from '../../shared/HeadingText';
33
import UnderLine from '../../shared/UnderLine';
4-
import news_info from '../../data/home/news_info';
54
import { Image, Link } from '@nextui-org/react';
65
import DefaultButton from '../../shared/DefaultButton';
76
import Subtitle from '../../shared/Subtitle';
7+
import events_info from '../../data/home/events_info';
88

9-
const News = () => {
9+
const Events = () => {
1010
return (
1111
<main className='my-10 w-11/12 mx-auto'>
1212
<HeadingText
1313
styles={'md:w-1/2 mx-auto my-10'}
14-
heading={'Latest News'}
14+
heading={'Latest Events'}
1515
></HeadingText>
1616
<div className="flex flex-wrap justify-center my-10">
1717
<UnderLine style={'w-48 h-2'} />
1818
</div>
1919
{/* Latest card */}
2020
<div className="grid xl:grid-cols-4 lg:grid-cols-3 md:grid-cols-2 grid-cols-1 justify-center gap-4 w-fit">
21-
{news_info.map(({ date, description, img, title }, index) => (
21+
{events_info.map(({ date, description, img, title }, index) => (
2222
<div key={index} className="w-fit rounded-md border border-dark/10 bg-white">
2323
<Link href='/'>
2424
<Image radius='sm' className='3xl:h-60 2xl:h-54 h-48 object-cover object-center' src={img} alt={title} />
@@ -38,4 +38,4 @@ const News = () => {
3838
);
3939
};
4040

41-
export default News;
41+
export default Events;

0 commit comments

Comments
 (0)