Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

worked with the careerDetail page #51

Merged
merged 2 commits into from
Aug 20, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/App.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,13 @@ import Donners from "./pages/donners/Donners";
import Home from "./pages/home/Home";
import Leadership from "./pages/leadership/Leadership";
import Faqs from "./pages/faqs/Faqs";
import CareerDetails from "./pages/careerdetails/CareerDetails";
import Blog from "./pages/Blog/Blog";
import BlogDetails from "./pages/Blog/BlogDetails";
import Event from "./pages/event/Event";
import EventDetails from "./pages/event/EventDetails";
import ApplyCareer from "./pages/applycareer/ApplyCareer";


function App() {
return (
<BrowserRouter>
Expand All @@ -33,13 +33,13 @@ function App() {
<Route path="/donners" element={<Donners />} />
<Route path="/causes/:id" element={<CauseDetails />} />
<Route path="/donate" element={<DonatePage />} />
<Route path="/careerdetails" element={<CareerDetails />} />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Check cause details route definition on line 29.
CareerDetails should have a /:id to it

<Route path="/blog" element={<Blog />} />
<Route path="/blog/:id" element={<BlogDetails />} />
<Route path="/event" element={<Event />} />
<Route path="/event/:id" element={<EventDetails />} />
<Route path="/applycareer" element={<ApplyCareer />} />


</Routes>
</BrowserRouter>
);
Expand Down
2 changes: 1 addition & 1 deletion src/components/Button.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ function Button({ icon, text, type, href, className, ...props }) {
{text}
{icon}
</Link>
) : (
): (
<button className={`${type} ${className}`} {...props}>
{text}
{icon}
Expand Down
2 changes: 1 addition & 1 deletion src/components/layout/GeneralHero.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ function GeneralHero(props) {
<div className=" flex flex-col items-center text-center justify-center ">
<h1 className=" text-3xl md:text-5xl ">{title}</h1>

<div className="flex flex-row items-center gap-4 text-slate-200 text-2xl">
<div className="flex flex-row items-center gap-4 text-slate-200 text-2xl mt-4">
<p>
<Link to="/" className="">
Home
Expand Down
29 changes: 29 additions & 0 deletions src/pages/careerdetails/CareerDetails.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import React from 'react'
import Header from '../../components/layout/Header'
import Footer from '../../components/layout/Footer'
import GeneralHero from '../../components/layout/GeneralHero'
import career from '../career/Career'
import image from "../../assets/images/Rectangle 2.png";
import CareerDetailSection from './components/CareerDetailSection'

const CareerDetails = () => {
return (
<div>

<Header/>
<GeneralHero
title="Career"
subTitle={career?.title || "Teacher Educator"}
image={image}
></GeneralHero>

<CareerDetailSection/>

<Footer/>

</div>
)
}

export default CareerDetails

169 changes: 169 additions & 0 deletions src/pages/careerdetails/components/CareerDetailSection.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,169 @@
import React from 'react'
import Button from '../../../components/Button'

const CareerDetailSection = () => {
return (
<div className='mx-28 mr-28'>
<div className='flex justify-between mt-8'>
<div>
<h1 className='text-4xl font-bold'>TEACHER EDUCATOR</h1>
<div className='flex gap-16 text-xl mt-4'>
<p>Full time</p>
<p>Remote</p>
<p>2-4years</p>
</div>
</div>

<div>
<Button className="primary-button"
text="Apply Now"
icon={<i className="fa fa-angle-right"></i>}
/>

</div>
</div>

<div className='flex justify-evenly mt-9 mb-6'>
<div>
<h1 className='text-2xl font-semibold mb-7'>About Role</h1>
<ul>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
architecto illo. Eaque sed qui nemo architecto!
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
architecto illo. Eaque sed qui nemo architecto!</p> </ul>
</div>

<div>
<h1 className='text-2xl font-semibold mb-10'>Similar Jobs</h1>
<div className='bg-slate-300 w-96 h-48 '>
<h1 className='text-2xl font-semibold mx-10 mt-5'>Marketing Volunteer</h1>
<div className='flex gap-8 text-xl mx-10 mt-5'>
<p>Full time</p>
<p>Remote</p>
<p>2-4years</p>
</div>
<button className='secondary-button mx-10 mt-12'>Apply Now
<i className="fa fa-angle-right"></i>
</button>

</div>

</div>
</div>

<div className='flex justify-evenly mt-9 mb-6'>
<div>
<h1 className='text-2xl font-semibold mb-7'>Qualification</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
architecto illo. Eaque sed qui nemo architecto!
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
architecto illo. Eaque sed qui nemo architecto!</p>
</div>

<div>
<div className='bg-slate-300 w-96 h-48 '>
<h1 className='text-2xl font-semibold mx-10'>Marketing Volunteer</h1>
<div className='flex gap-8 text-xl mx-10 mt-5'>
<p>Full time</p>
<p>Remote</p>
<p>2-4years</p>
</div>
<button className='secondary-button mx-10 mt-12'>Apply Now
<i className="fa fa-angle-right"></i>
</button>

</div>

</div>
</div>

<div className='flex justify-evenly mt-9 mb-6'>
<div>
<h1 className='text-2xl font-semibold mb-7'>Responsibilities</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
architecto illo. Eaque sed qui nemo architecto!
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
architecto illo. Eaque sed qui nemo architecto!</p>
</div>

<div>
<h1 className='text-2xl font-semibold mb-10'>More Jobs</h1>
<div className='bg-slate-300 w-96 h-48 '>
<h1 className='text-2xl font-semibold mx-10'>Marketing Volunteer</h1>
<div className='flex gap-8 text-xl mx-10 mt-5'>
<p>Full time</p>
<p>Remote</p>
<p>2-4years</p>
</div>
<button className='secondary-button mx-10 mt-12'>Apply Now
<i className="fa fa-angle-right"></i>
</button>

</div>

</div>
</div>


<div className='flex justify-evenly mt-9 mb-6'>
<div>
<h1 className='text-2xl font-semibold mb-7'>More Role</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
architecto illo. Eaque sed qui nemo architecto!
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
Iusto doloremque veritatis eum quasi placeat fugiat
nostrum maxime quos corporis cum quas, temporibus, inventore,
architecto illo. Eaque sed qui nemo architecto!</p>
</div>

<div>

<div className='bg-slate-300 w-96 h-48 '>
<h1 className='text-2xl font-semibold mx-10'>Marketing Volunteer</h1>
<div className='flex gap-8 text-xl mx-10 mt-5'>
<p>Full time</p>
<p>Remote</p>
<p>2-4years</p>
</div>
<button className='secondary-button mx-10 mt-12'>Apply Now
<i className="fa fa-angle-right"></i>
</button>

</div>

</div>
</div>



</div>
)
}

export default CareerDetailSection
2 changes: 2 additions & 0 deletions src/pages/home/components/HelpSection.jsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,9 @@
import React from "react";

import icon from "/assets/images/Icon.png";
import icon2 from "/assets/images/Icon2.png";
import icon3 from "/assets/images/Icon3.png";

import HelpCard from "./HelpCard";

function HelpSection() {
Expand Down