Our Approach Page Updated
This commit is contained in:
parent
3fd51aa45e
commit
16086fae90
64
api/our-approach.js
Normal file
64
api/our-approach.js
Normal file
@ -0,0 +1,64 @@
|
||||
const Ourapproach = [
|
||||
{
|
||||
id: 1,
|
||||
authorTitle: "Our Approach",
|
||||
title: "Innovative Solutions for Every Challenge",
|
||||
para: "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
|
||||
description: `
|
||||
<p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
`,
|
||||
screens: "/images/funfact.jpg"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
authorTitle: "Our Mission",
|
||||
title: "Empowering Businesses Through Technology",
|
||||
para: "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
|
||||
description: `
|
||||
<p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
`,
|
||||
screens: "/images/funfact.jpg"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
authorTitle: "Our Values",
|
||||
title: "Commitment, Integrity, and Innovation",
|
||||
para: "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
|
||||
description: `
|
||||
<p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
`,
|
||||
screens: "/images/funfact.jpg"
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
authorTitle: "Our Values",
|
||||
title: "Commitment, Integrity, and Innovation",
|
||||
para: "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
|
||||
description: `
|
||||
<p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
`,
|
||||
screens: "/images/funfact.jpg"
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
authorTitle: "Our Values",
|
||||
title: "Commitment, Integrity, and Innovation",
|
||||
para: "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
|
||||
description: `
|
||||
<p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
`,
|
||||
screens: "/images/funfact.jpg"
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
authorTitle: "Our Values",
|
||||
title: "Commitment, Integrity, and Innovation",
|
||||
para: "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
|
||||
description: `
|
||||
<p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
|
||||
`,
|
||||
screens: "/images/funfact.jpg"
|
||||
}
|
||||
];
|
||||
|
||||
export default Ourapproach;
|
||||
@ -65,7 +65,7 @@ const ClickHandler = () => {
|
||||
|
||||
const Features = (props) => {
|
||||
return (
|
||||
<section className={`wpo-service-section section-padding ${props.sClass}`}>
|
||||
<section className={`wpo-service-section section-padding-top ${props.sClass}`}>
|
||||
<div className="container">
|
||||
<SectionTitle subTitle={'Mission And Vision'} Title={'How we can build a better country together!'}/>
|
||||
<div className="row-grid wpo-service-slider">
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import React from 'react'
|
||||
import sign from '/public/images/signeture.png'
|
||||
import React from 'react';
|
||||
import sign from '/public/images/signeture.png';
|
||||
import Image from 'next/image';
|
||||
|
||||
const AboutSection = (props) => {
|
||||
@ -8,36 +8,54 @@ const AboutSection = (props) => {
|
||||
<div className="container">
|
||||
<div className="wpo-about-wrap">
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6 col-md-12 col-12">
|
||||
|
||||
{/* Text Column — Show first on mobile, second on desktop */}
|
||||
<div className="col-lg-6 col-md-12 col-12 order-1 order-lg-2">
|
||||
<div className="wpo-about-text">
|
||||
<div className="wpo-section-title">
|
||||
<span>About Politian</span>
|
||||
<h2>We Can Work Together For Create a Better Future.</h2>
|
||||
</div>
|
||||
<p>
|
||||
The leader is eager to listen to the needs of the youth generation and to hear what
|
||||
solutions they have to the problems they are facing. He hopes to find solutions that
|
||||
will help them lead meaningful lives and make lasting change in the world.
|
||||
</p>
|
||||
<p>
|
||||
He believes that the collaboration between the youth and the leaders of society is
|
||||
necessary to bring about a brighter future. Now, he is ready to take the first step
|
||||
to making that happen.
|
||||
</p>
|
||||
<div className="quote">
|
||||
<p>
|
||||
“We can start by taking small steps and making small changes that can have a big
|
||||
impact on the world.”
|
||||
</p>
|
||||
</div>
|
||||
<div className="wpo-about-left-info">
|
||||
<div className="wpo-about-left-inner">
|
||||
<div className="wpo-about-left-text">
|
||||
<h5>Robert Willum</h5>
|
||||
<span>CEO & Founder of Manit</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="signeture">
|
||||
<Image src={sign} alt="Signature" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Image Column — Show second on mobile, first on desktop */}
|
||||
<div className="col-lg-6 col-md-12 col-12 order-2 order-lg-1">
|
||||
<div className="wpo-about-img">
|
||||
<Image src={props.abimg} alt="" />
|
||||
<Image src={props.abimg} alt="About Image" />
|
||||
<div className="wpo-about-img-text">
|
||||
<h4>1998</h4>
|
||||
|
||||
<div className="rotate-text">
|
||||
<span>W</span>
|
||||
<span>e</span>
|
||||
<span>A</span>
|
||||
<span>r</span>
|
||||
<span>e</span>
|
||||
<span>W</span>
|
||||
<span>o</span>
|
||||
<span>r</span>
|
||||
<span>k</span>
|
||||
<span>i</span>
|
||||
<span>n</span>
|
||||
<span>g</span>
|
||||
<span>F</span>
|
||||
<span>o</span>
|
||||
<span>r</span>
|
||||
<span>Y</span>
|
||||
<span>o</span>
|
||||
<span>u</span>
|
||||
<span>S</span>
|
||||
<span>i</span>
|
||||
<span>n</span>
|
||||
<span>c</span>
|
||||
<span>e</span>
|
||||
{Array.from("WeAreWorkingForYouSince").map((letter, index) => (
|
||||
<span key={index}>{letter}</span>
|
||||
))}
|
||||
</div>
|
||||
<div className="dots">
|
||||
<span></span>
|
||||
@ -56,40 +74,12 @@ const AboutSection = (props) => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 col-md-12 col-12">
|
||||
<div className="wpo-about-text">
|
||||
<div className="wpo-section-title">
|
||||
<span>About Politian</span>
|
||||
<h2>We Can Work Together For Create a Better Future.</h2>
|
||||
</div>
|
||||
<p>The leader is eager to listen to the needs of the youth generation and to hear what
|
||||
solutions they have to the problems they are facing. He hopes to find solutions that
|
||||
will help them lead meaningful lives and make lasting change in the world. </p>
|
||||
<p>He believes that the collaboration between the youth and the leaders of society is
|
||||
necessary to bring about a brighter future. Now, he is ready to take the first step
|
||||
to making that happen.</p>
|
||||
<div className="quote">
|
||||
<p>“We can start by taking small steps and making small changes that can have a big
|
||||
impact on the world.”</p>
|
||||
</div>
|
||||
<div className="wpo-about-left-info">
|
||||
<div className="wpo-about-left-inner">
|
||||
<div className="wpo-about-left-text">
|
||||
<h5>Robert Willum</h5>
|
||||
<span>CEO & Founder of Manit</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="signeture">
|
||||
<Image src={sign} alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
export default AboutSection;
|
||||
export default AboutSection;
|
||||
|
||||
@ -46,6 +46,7 @@ const Header2 = (props) => {
|
||||
<li><Link onClick={ClickHandler} href="/home4">Female Candidate</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><Link onClick={ClickHandler} href="/our-approach">Our Approach</Link></li>
|
||||
<li><Link onClick={ClickHandler} href="/about">About us</Link>
|
||||
<ul className="sub-menu">
|
||||
<li><Link onClick={ClickHandler} href="/about/our-mission">Our Mission</Link></li>
|
||||
@ -61,7 +62,7 @@ const Header2 = (props) => {
|
||||
<li><Link onClick={ClickHandler} href="/campaign-single/Support-for-Womans">Campaign single</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li className="menu-item-has-children">
|
||||
{/* <li className="menu-item-has-children">
|
||||
<Link onClick={ClickHandler} href="/">Pages</Link>
|
||||
<ul className="sub-menu">
|
||||
<li><Link onClick={ClickHandler} href="/gallery">Gallery</Link></li>
|
||||
@ -85,7 +86,7 @@ const Header2 = (props) => {
|
||||
<li><Link onClick={ClickHandler} href="/login">Login</Link></li>
|
||||
<li><Link onClick={ClickHandler} href="/register">Register</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
</li> */}
|
||||
<li className="menu-item-has-children">
|
||||
<Link onClick={ClickHandler} href="/">Blog</Link>
|
||||
<ul className="sub-menu">
|
||||
|
||||
73
components/our-approach/OurApproachSection.js
Normal file
73
components/our-approach/OurApproachSection.js
Normal file
@ -0,0 +1,73 @@
|
||||
import React from 'react';
|
||||
import Image from 'next/image';
|
||||
import Ourapproach from '../../api/our-approach';
|
||||
|
||||
const OurApproachSection = () => {
|
||||
return (
|
||||
<>
|
||||
{Ourapproach.map((item, index) => {
|
||||
const isEven = index % 2 !== 0;
|
||||
const sectionStyle = {
|
||||
backgroundColor: index % 2 === 0 ? '#fbfbfbff' : '#e8ebf5',
|
||||
color: index % 2 === 0 ? '#ffffffff' : '#fff',
|
||||
paddingTop: '60px',
|
||||
paddingBottom: '60px',
|
||||
};
|
||||
|
||||
return (
|
||||
<section
|
||||
key={item.id}
|
||||
className="wpo-about-section section-padding-top-bottom"
|
||||
style={sectionStyle}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="wpo-about-wrap">
|
||||
<div className="row align-items-center">
|
||||
{/* Content Column */}
|
||||
<div
|
||||
className={`col-lg-6 col-md-12 col-12 ${
|
||||
isEven ? 'order-1 order-lg-1' : 'order-1 order-lg-2'
|
||||
}`}
|
||||
>
|
||||
<div className="wpo-about-text">
|
||||
<div className="wpo-section-title">
|
||||
<span>{item.authorTitle}</span>
|
||||
<h2>{item.title}</h2>
|
||||
</div>
|
||||
<p>{item.para}</p>
|
||||
<div
|
||||
dangerouslySetInnerHTML={{ __html: item.description }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Image Column */}
|
||||
<div
|
||||
className={`col-lg-6 col-md-12 col-12 ${
|
||||
isEven ? 'order-2 order-lg-2' : 'order-2 order-lg-1'
|
||||
}`}
|
||||
>
|
||||
<div className="wpo-about-img">
|
||||
<Image
|
||||
src={item.screens}
|
||||
alt={item.title}
|
||||
width={600}
|
||||
height={400}
|
||||
style={{
|
||||
objectFit: 'cover',
|
||||
borderRadius: '10px',
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
})}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default OurApproachSection;
|
||||
21
pages/our-approach/index.js
Normal file
21
pages/our-approach/index.js
Normal file
@ -0,0 +1,21 @@
|
||||
import React, { Fragment } from 'react';
|
||||
import Navbar2 from '../../components/Navbar2/Navbar2';
|
||||
import PageTitle from '../../components/pagetitle/PageTitle'
|
||||
import Scrollbar from '../../components/scrollbar/scrollbar'
|
||||
|
||||
import Footer from '../../components/footer/Footer';
|
||||
import abimg from '/public/images/about-s2.jpg'
|
||||
import OurApproachSection from '../../components/our-approach/OurApproachSection';
|
||||
|
||||
const OurApproach = () => {
|
||||
return (
|
||||
<Fragment>
|
||||
<Navbar2 />
|
||||
<PageTitle pageTitle={'Our Approach'} pagesub={'Our Approach'} />
|
||||
<OurApproachSection abimg={abimg} abClass={'wpo-about-section-s2'}/>
|
||||
<Footer />
|
||||
<Scrollbar />
|
||||
</Fragment>
|
||||
)
|
||||
};
|
||||
export default OurApproach;
|
||||
@ -97,6 +97,7 @@ img {
|
||||
.section-padding-top-bottom{
|
||||
|
||||
padding-top: 120px !important;
|
||||
padding-bottom: 120px !important;
|
||||
|
||||
}
|
||||
|
||||
|
||||
@ -180,7 +180,8 @@
|
||||
padding-bottom: 0px;
|
||||
|
||||
@media(max-width:991px) {
|
||||
padding-top: 0;
|
||||
padding-top: 60px !important;
|
||||
padding-bottom: 60px !important;
|
||||
}
|
||||
|
||||
&.pt-padding{
|
||||
@ -458,9 +459,9 @@
|
||||
}
|
||||
|
||||
.wpo-about-text {
|
||||
@media(max-width:991px) {
|
||||
margin-top: 120px;
|
||||
}
|
||||
// @media(max-width:991px) {
|
||||
// margin-top: 120px;
|
||||
// }
|
||||
|
||||
.wpo-section-title {
|
||||
text-align: left;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user