-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #2 from afsaa/dev
Dev updates
- Loading branch information
Showing
37 changed files
with
965 additions
and
220 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,35 @@ | ||
import React from 'react'; | ||
import { Project } from '../../generated/graphql'; | ||
import Icon from '../../ui/icon'; | ||
import Link from 'next/link'; | ||
|
||
interface ProjectCardProps extends Project {} | ||
|
||
const ProjectCard = ({ title, description, technologies, image, url }: ProjectCardProps): JSX.Element => { | ||
return ( | ||
<Link href={url} target="_blank"> | ||
<div className="max-w-md border border-stone-600 rounded-xl bg-black/50 shadow-md overflow-hidden hover:opacity-80 focus:opacity-80"> | ||
<img src={image?.url || 'https://via.placeholder.com/400x250'} alt={title} className="w-full h-48 object-fill" /> | ||
<div className="p-4"> | ||
<h3 className="mb-2 font-montserrat font-bold text-xl">{title}</h3> | ||
<p className="mb-4 font-cabin text-carrara/50 whitespace-normal">{description}</p> | ||
<div className="flex flex-wrap"> | ||
{technologies.map((technology) => ( | ||
<span key={technology} className="mr-2 mb-2 py-1 px-2 rounded-full bg-primary-light text-mirage font-cabin font-medium text-sm"> | ||
{technology} | ||
</span> | ||
))} | ||
</div> | ||
<div className="mt-2"> | ||
<p className="flex items-center gap-2 text-white font-cabin"> | ||
<Icon icon="BiLink" fontSize="20px" color="white" /> | ||
{url} | ||
</p> | ||
</div> | ||
</div> | ||
</div> | ||
</Link> | ||
); | ||
}; | ||
|
||
export default ProjectCard; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,57 @@ | ||
import React, { useState } from 'react'; | ||
import { Skill } from '../../generated/graphql'; | ||
import { useTranslations } from '../../hooks'; | ||
import SkillItem from './partials/SkillItem'; | ||
|
||
interface ISkill { | ||
skills: Skill[]; | ||
hasHardSkills?: boolean; | ||
hasSoftSkills?: boolean; | ||
hasOtherSkills?: boolean; | ||
} | ||
|
||
const SkillComponent = ({ skills, hasHardSkills, hasSoftSkills, hasOtherSkills }: ISkill): JSX.Element => { | ||
const translationsResponse = useTranslations('Skill'); | ||
const [labels, setLabels] = useState(async () => { | ||
await translationsResponse.then((data) => { | ||
setLabels(data); | ||
}); | ||
}); | ||
|
||
return ( | ||
<> | ||
{hasHardSkills && ( | ||
<div> | ||
<h2 className="text-2xl font-montserrat">{labels['hardSkillsHeading']}</h2> | ||
<div className="my-5 flex items-center justify-around md:justify-start flex-wrap gap-10"> | ||
{skills.map((skill) => { | ||
return <SkillItem type="hard" name={skill.technology} />; | ||
})} | ||
</div> | ||
</div> | ||
)} | ||
{hasSoftSkills && ( | ||
<div> | ||
<h2 className="text-2xl font-montserrat">{labels['softSkillsHeading']}</h2> | ||
<div className="my-5 flex md:flex-row flex-col items-center justify-start gap-10 font-cabin"> | ||
{skills.map((skill) => { | ||
return <SkillItem type="soft" name={skill.technology} />; | ||
})} | ||
</div> | ||
</div> | ||
)} | ||
{hasOtherSkills && ( | ||
<div> | ||
<h2 className="text-2xl font-montserrat"> {labels['otherSkillsHeading']}</h2> | ||
<div className="my-5 flex md:flex-row flex-col items-center justify-start gap-10 font-cabin"> | ||
{skills.map((skill) => { | ||
return <SkillItem type="other" name={skill.technology} />; | ||
})} | ||
</div> | ||
</div> | ||
)} | ||
</> | ||
); | ||
}; | ||
|
||
export default SkillComponent; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
import React from 'react'; | ||
import Icon from '@/ui/icon'; | ||
|
||
interface ISkillItem { | ||
type: 'hard' | 'soft' | 'other'; | ||
name: string; | ||
} | ||
|
||
const SkillItem = ({ type, name }: ISkillItem): JSX.Element => { | ||
const hasSoftOrOtherSkill: boolean = type === 'soft' || type === 'other'; | ||
|
||
return ( | ||
<> | ||
{type === 'hard' && ( | ||
<span className="flex flex-col items-center font-cabin"> | ||
<Icon className="mb-2 text-carrara" icon={`Si${name}`} fontSize="50px" color="" /> | ||
{name} | ||
</span> | ||
)} | ||
{hasSoftOrOtherSkill && ( | ||
<div className="my-5 flex md:flex-row flex-col items-center justify-start gap-10 font-cabin"> | ||
<p>{name}</p> | ||
</div> | ||
)} | ||
</> | ||
); | ||
}; | ||
|
||
export default SkillItem; |
Oops, something went wrong.