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

feat(page): blogs #106

Closed
wants to merge 1 commit into from
Closed
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
2 changes: 1 addition & 1 deletion src/components/developeravatar/DeveloperAvatar.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ const DeveloperAvatar = ({ name, avatarUrl, description, href }) => {
layout='fill'
/>
</div>
<p className='text-xl text-lime-800 font-semibold my-2'>
<p className='text-xl text-lime-600 font-semibold my-2'>
{name}
</p>
<p className='text-black text-base w-4/5 md:w-full '>
Expand Down
156 changes: 75 additions & 81 deletions src/pages/about/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,94 +5,88 @@ import DeveloperAvatar from "@/components/developeravatar/DeveloperAvatar";
function AboutPage() {
return (
<section>
<div className='bg-gradient-to-tr from-lime-400 via-white to-white'>
<div className='sm:flex flex flex-row items-center max-w-screen-xl flex-wrap-reverse p-10 lg:p-0'>
<div className='sm:w-1/2 lg:pb-24 pb-16 pt-20 lg:pl-32 pl-1'>
<div className='display block lg:h-80 lg:w-96 max-w-screen-xl max-h-96'>
<Image
className='w-10/12 h-96 blur-sm drop-shadow-2xl flex items-center justify-center'
src='/images/aboutus.png'
width={500}
height={500}
alt='hero'
/>
</div>
<div className='sm:flex flex flex-row items-center max-w-screen-xl flex-wrap-reverse p-10 lg:p-0'>
<div className='sm:w-1/2 lg:pb-24 pb-16 pt-20 lg:pl-32 pl-1'>
<div className='display block lg:h-80 lg:w-96 max-w-screen-xl max-h-96'>
<Image
className='w-10/12 h-96 blur-sm drop-shadow-2xl flex items-center justify-center'
src='/images/aboutus.png'
width={500}
height={500}
alt='hero'
/>
</div>
<div className='sm:w-1/2 p-5'>
<div className='text'>
<span className='text-gray-500 border-b-2 border-lime-600 uppercase'>
About us
</span>
</div>
<div className='sm:w-1/2 p-5'>
<div className='text'>
<span className='text-gray-500 border-b-2 border-lime-600 uppercase'>
About us
</span>

<h2 className='my-4 font-bold text-3xl sm:text-4xl '>
Who{" "}
<span className='text-lime-600'>We Are</span>
</h2>
<p className='text-gray-700'>
Welcome to Let&apos;s Share - where sharing is
caring! In our community, we believe in the
heartwarming essence of sharing daily
essentials. Extra food, lovely clothes, or cozy
furniture - at Let&apos;s Share, it&apos;s about
connecting and making a positive impact right
where you are. Let&apos;s transform our region
into a haven of shared moments. Join Let&apos;s
Share, where sharing isn&apos;t just a choice;
it&apos;s a way of life.
</p>
</div>
<h2 className='my-4 font-bold text-3xl sm:text-4xl '>
Who <span className='text-lime-600'>We Are</span>
</h2>
<p className='text-gray-700'>
Welcome to Let&apos;s Share - where sharing is
caring! In our community, we believe in the
heartwarming essence of sharing daily essentials.
Extra food, lovely clothes, or cozy furniture - at
Let&apos;s Share, it&apos;s about connecting and
making a positive impact right where you are.
Let&apos;s transform our region into a haven of
shared moments. Join Let&apos;s Share, where sharing
isn&apos;t just a choice; it&apos;s a way of life.
</p>
</div>
</div>
</div>

<div className='bg-gradient-to-br from-lime-400 via-white to-white'>
<div className='flex flex-wrap justify-center mb-20'>
<div className='text-center w-full mb-4'>
<h1 className='text-3xl font-bold p-12'>Our Team</h1>
</div>
{/* Developer 1 */}
<DeveloperAvatar
name='Darine Tag'
avatarUrl='/images/developer1.png'
description='Visionary creator of seamless, stunning user experiences.'
href='https://www.linkedin.com/in/darine-tag/'
/>
{/* Developer 2 */}
<DeveloperAvatar
name='Hadj Said Bouras'
avatarUrl='/images/developer2.jfif'
description='Meticulous architect, crafting clean, efficient, pixel-perfect interfaces.'
href='https://www.linkedin.com/in/hadj-said-front-end-web-developer-a577a8255/'
/>
{/* Developer 3 */}
<DeveloperAvatar
name='Ismail Benlaredj'
avatarUrl='/images/developer3.jfif'
description='Dynamic innovator, blends energy, tech trends for excellence.'
href='https://www.linkedin.com/in/ismailbenlaredj/'
/>
{/* Developer 4 */}
<DeveloperAvatar
name='Mohamed Cheraitia'
avatarUrl='/images/mohamed-ch.jpg'
description='Versatile engineer, seamlessly blends creativity with technicality.'
href='https://www.linkedin.com/in/mohamed-ch-947939272/'
/>
{/* Developer 5 */}
<DeveloperAvatar
name='Laid Benglia'
avatarUrl='/images/laid benglia.jpg'
description='Front-end magician, turns ideas into interactive wonders.'
href='https://www.linkedin.com/in/laid-benglia-452013199/'
/>
{/* Developer 6 */}
<DeveloperAvatar
name='sara Bagache'
avatarUrl='/images/sara bagach.jpg'
description='Pragmatic developer, builds robust, scalable, user-friendly applications.'
href='https://github.com/SaraBegache'
/>
<div className='flex flex-wrap justify-center mb-20 gap-10'>
<div className='text-center w-full mb-4'>
<h1 className='text-3xl font-bold p-12'>Our Team</h1>
</div>
{/* Developer 1 */}
<DeveloperAvatar
name='Darine Tag'
avatarUrl='/images/developer1.png'
description='Visionary creator of seamless, stunning user experiences.'
href='https://www.linkedin.com/in/darine-tag/'
/>
{/* Developer 2 */}
<DeveloperAvatar
name='Hadj Said Bouras'
avatarUrl='/images/developer2.jfif'
description='Meticulous architect, crafting clean, efficient, pixel-perfect interfaces.'
href='https://www.linkedin.com/in/hadj-said-front-end-web-developer-a577a8255/'
/>
{/* Developer 3 */}
<DeveloperAvatar
name='Ismail Benlaredj'
avatarUrl='/images/developer3.jfif'
description='Dynamic innovator, blends energy, tech trends for excellence.'
href='https://www.linkedin.com/in/ismailbenlaredj/'
/>
{/* Developer 4 */}
<DeveloperAvatar
name='Mohamed Cheraitia'
avatarUrl='/images/mohamed-ch.jpg'
description='Versatile engineer, seamlessly blends creativity with technicality.'
href='https://www.linkedin.com/in/mohamed-ch-947939272/'
/>
{/* Developer 5 */}
<DeveloperAvatar
name='Laid Benglia'
avatarUrl='/images/laid benglia.jpg'
description='Front-end magician, turns ideas into interactive wonders.'
href='https://www.linkedin.com/in/laid-benglia-452013199/'
/>
{/* Developer 6 */}
<DeveloperAvatar
name='sara Bagache'
avatarUrl='/images/sara bagach.jpg'
description='Pragmatic developer, builds robust, scalable, user-friendly applications.'
href='https://github.com/SaraBegache'
/>
</div>
</section>
);
Expand Down
8 changes: 5 additions & 3 deletions src/pages/blog/[slug].jsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,15 @@ import { getAllPosts, getPostBySlug, markdownToHtml } from "@/lib/blogApi";
const PostHeader = ({ title, image, imageAlt, date, timeToRead }) => {
return (
<>
<div className='mb-20 text-center'>
<div className='mb-20 text-center mt-14'>
<img
src={image}
alt={imageAlt}
className='w-full h-[35rem] object-cover rounded-lg'
/>
<h1 className='text-3xl my-8'>{title}</h1>
<h1 className='text-4xl font-bold my-8 text-lime-600'>
{title}
</h1>
<p>{`Time to read ${timeToRead} min`} </p>
<p>{`publiched: ${new Date(date).toDateString()}`}</p>
</div>
Expand All @@ -22,7 +24,7 @@ const PostHeader = ({ title, image, imageAlt, date, timeToRead }) => {
};
const PostBody = ({ content }) => {
return (
<div className='max-w-5xl mx-auto'>
<div className='max-w-3xl text-center mx-auto'>
<div
className='prose-p:w-full lg:prose-xl w-full lg:w-[58rem] prose prose-override-width text-black
prose-headings:text-black
Expand Down
8 changes: 4 additions & 4 deletions src/pages/blog/_posts/post1-copy.md
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
---
title: "The Power of Sharing: How Students Can Help Each Other Succeed"
title: "How Students Can Help Each Other Succeed"
description: "In the world of education, students often find themselves in a race to acquire knowledge and skills. While individual efforts are crucial, the power of sharing and helping fellow students should not be underestimated."
coverImage: "https://images.unsplash.com/photo-1531545514256-b1400bc00f31?auto=format&fit=crop&q=60&w=500&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MTF8fHN0dWRlbnRzfGVufDB8fDB8fHww"
coverImage: "https://images.unsplash.com/photo-1534009916851-7850ba974f9c?q=80&w=1374&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"
date: "2023-10-26"
author:
name: Ismail Benlaredj
picture: "https://images.unsplash.com/photo-1633332755192-727a05c4013d?auto=format&fit=crop&q=60&w=500&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8OHx8YXZhdGFyfGVufDB8fDB8fHww"
picture: "https://images.unsplash.com/photo-1534009916851-7850ba974f9c?q=80&w=1374&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"
ogImage:
url: "https://images.unsplash.com/photo-1531545514256-b1400bc00f31?auto=format&fit=crop&q=60&w=500&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MTF8fHN0dWRlbnRzfGVufDB8fDB8fHww"
url: "https://images.unsplash.com/photo-1534009916851-7850ba974f9c?q=80&w=1374&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"
---

In the world of education, students often find themselves in a race to acquire knowledge and skills. While individual efforts are crucial, the power of sharing and helping fellow students should not be underestimated. This cooperative approach can lead to a more supportive and successful learning environment for everyone involved.
Expand Down
Loading
Loading