Skip to content

Commit

Permalink
updated sizes
Browse files Browse the repository at this point in the history
  • Loading branch information
@Moealsir
Moealsir committed Jul 1, 2024
1 parent 6ae4c55 commit f35f0e5
Show file tree
Hide file tree
Showing 3 changed files with 49 additions and 48 deletions.
34 changes: 17 additions & 17 deletions app/components/ResumeCard.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,20 +1,20 @@
import React from 'react';
import Image from 'next/image';
import useIntersectionObserver from './ui/useIntersectionObserver';
import React from 'react';
import Image from 'next/image';
import useIntersectionObserver from './ui/useIntersectionObserver';

const ResumeCard = ({ icon, title, children }) => {
const h1Ref = useIntersectionObserver({ threshold: 0.2 });
return (
<div ref={h1Ref} className={`scroll-element py-2 max-xl:py-0 px-4 max-sm:px-4 max-sm:py-2 flex flex-col justify-start text-start rounded-md bg-paradiso-800 text-white shadow-xl mb-6 max-sm:mb-8 card-shadow`}>
<div className='flex items-center gap-2 p-2'>
<Image src={icon} alt={title} width={30} height={30} style={{ filter: 'invert(1)' }} />
<h2 className='text-2xl max-sm:text-2xl font-semibold'>{title}</h2>
const ResumeCard = ({ icon, title, children }) => {
const h1Ref = useIntersectionObserver({ threshold: 0.2 });
return (
<div ref={h1Ref} className={`scroll-element py-2 max-xl:py-0 px-4 max-sm:px-4 max-sm:py-2 flex flex-col justify-start text-start rounded-md bg-paradiso-800 text-white shadow-xl mb-6 max-sm:mb-8 card-shadow`}>
<div className='flex items-center gap-2 p-2'>
<Image src={icon} alt={title} width={30} height={30} style={{ filter: 'invert(1)' }} />
<h2 className='text-2xl max-sm:text-2xl font-semibold'>{title}</h2>
</div>
<div className='flex flex-col space-y-2 text-wrap'>
{children}
</div>
</div>
<div className='flex flex-col space-y-2 text-wrap'>
{children}
</div>
</div>
);
};
);
};

export default ResumeCard;
export default ResumeCard;
57 changes: 29 additions & 28 deletions app/constants/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,10 +78,11 @@ export const projectData = [
link: 'https://moealsir.github.io',
year: '06-2024',
used: [
{ name: "Next Js", src: nextjs, bgClass: "green-badge" },
{ name: "React", src: reactbadge, bgClass: "black-badge" },
{ name: "HTML", src: htmlbadge, bgClass: "orange-badge" },
{ name: "Tailwind CSS", src: tailwindbadge, bgClass: "teal-badge" },
{ name: "Next Js", src: nextjs },
{ name: "React", src: reactbadge },
{ name: "HTML", src: htmlbadge },
{ name: "TypeScript", src: typescriptbadge },
{ name: "Tailwind CSS", src: tailwindbadge },
],
},
{
Expand All @@ -92,11 +93,11 @@ export const projectData = [
link: 'https://moealsir.github.io/get_started',
year: '2024',
used: [
{ name: "Next Js", src: nextjs, bgClass: "green-badge" },
{ name: "React", src: reactbadge, bgClass: "black-badge" },
{ name: "HTML", src: htmlbadge, bgClass: "orange-badge" },
{ name: "Tailwind CSS", src: tailwindbadge, bgClass: "teal-badge" },
{ name: "TypeScript", src: typescriptbadge, bgClass: "blue-badge" },
{ name: "Next Js", src: nextjs},
{ name: "React", src: reactbadge },
{ name: "HTML", src: htmlbadge },
{ name: "Tailwind CSS", src: tailwindbadge },
{ name: "TypeScript", src: typescriptbadge },
],
},
{
Expand All @@ -113,10 +114,10 @@ export const projectData = [
link: '',
year: '2024',
used: [
{ name: "Python", src: pythonbadge, bgClass: "blue-badge" },
{ name: "Database", src: htmlbadge, bgClass: "black-badge" },
{ name: "Selenium", src: seleniumbadge, bgClass: "green-badge" },
{ name: "Web Scraping", src: scrap, bgClass: "purple-badge" },
{ name: "Python", src: pythonbadge },
{ name: "Database", src: htmlbadge },
{ name: "Selenium", src: seleniumbadge },
{ name: "Web Scraping", src: scrap },
],
},
{
Expand All @@ -131,11 +132,11 @@ export const projectData = [
link: '',
year: '2024',
used: [
{ name: "Python", src: pythonbadge, bgClass: "blue-badge" },
{ name: "Node Js", src: nodejsbadge, bgClass: "green-badge" },
{ name: "Selenium", src: seleniumbadge, bgClass: "green-badge" },
{ name: "Web Scraping", src: scrap, bgClass: "purple-badge" },
{ name: "whatsapp web js", src: wwebjsbadge, bgClass: "teal-badge" },
{ name: "Python", src: pythonbadge },
{ name: "Node Js", src: nodejsbadge },
{ name: "Selenium", src: seleniumbadge },
{ name: "Web Scraping", src: scrap },
{ name: "whatsapp web js", src: wwebjsbadge },
],
},
{
Expand All @@ -149,11 +150,11 @@ export const projectData = [
link: '',
year: '2024',
used: [
{ name: "Python", src: pythonbadge, bgClass: "blue-badge" },
{ name: "Node js", src: nodejsbadge, bgClass: "green-badge" },
{ name: "Selenium", src: htmlbadge, bgClass: "green-badge" },
{ name: "Web Scraping", src: scrap, bgClass: "purple-badge" },
{ name: "Data Extraction", src: datafetch, bgClass: "red-badge" },
{ name: "Python", src: pythonbadge },
{ name: "Node js", src: nodejsbadge },
{ name: "Selenium", src: htmlbadge },
{ name: "Web Scraping", src: scrap },
{ name: "Data Extraction", src: datafetch },
],
},
{
Expand All @@ -164,11 +165,11 @@ export const projectData = [
link: '',
year: '2024',
used: [
{ name: "Python", src: pythonbadge, bgClass: "blue-badge" },
{ name: "Node js", src: nodejsbadge, bgClass: "green-badge" },
{ name: "Selenium", src: seleniumbadge, bgClass: "green-badge" },
{ name: "Web Scraping", src: scrap, bgClass: "purple-badge" },
{ name: "Data Extraction", src: datafetch, bgClass: "red-badge" },
{ name: "Python", src: pythonbadge },
{ name: "Node js", src: nodejsbadge },
{ name: "Selenium", src: seleniumbadge },
{ name: "Web Scraping", src: scrap },
{ name: "Data Extraction", src: datafetch },
],
}
];
Expand Down
6 changes: 3 additions & 3 deletions app/sections/Projects.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ const Projects = () => {
{projectData.map((project, index) => (
<div
key={index}
className="hover:shadow-md bg-paradiso-400 md:w-[500px] bg-opacity-90 rounded-xl flex flex-col items-center p-4"
className="scroll-element animate hover:shadow-md bg-paradiso-400 md:w-[500px] bg-opacity-90 rounded-xl flex flex-col items-center p-4"
>
<div className="w-full flex flex-col justify-between">
<figure className="project-figure w-full">
Expand Down Expand Up @@ -65,7 +65,7 @@ const Projects = () => {
</div>
</figure>

<div className="flex flex-col lg:w-[500px] sm:w-full max-sm:w-full">
<div className="flex flex-col sm:w-full max-sm:w-full">
<div className="text-white flex justify-between items-center w-full p-2">
<h2 className="text-2xl text-paradiso-200 project-title font-bold">
{project.title}
Expand All @@ -88,7 +88,7 @@ const Projects = () => {
</div>

<div className="text-start pt-4">
<p className="justify-start text-start px-4 mb-4 font-montserrat text-paradiso-800 text-xl leading-7">
<p className="justify-start text-start mb-4 font-montserrat text-paradiso-800 text-xl leading-7">
{project.description}
</p>
</div>
Expand Down

0 comments on commit f35f0e5

Please sign in to comment.