theoludwig/.profile
1
0
Fork 0
mirror of https://github.com/theoludwig/theoludwig.git synced 2025-12-12 20:46:52 +01:00
Code Issues Releases Activity

feat: add light mode + rewrite in Tailwind CSS (#15)

Browse Source
This commit is contained in:
Divlo
2021-05-08 19:52:04 +02:00
committed by GitHub
parent 26f24329c7
commit c62e66a86a
83 changed files with 5803 additions and 7623 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
components/Skills/Skill.tsx
View File

@@ -6,39 +6,21 @@ export interface SkillProps {
skill: keyof typeof skills
}
export const Skill: React.FC<SkillProps> = props => {
export const Skill: React.FC<SkillProps> = (props) => {
const { skill } = props
const skillProperties = skills[skill]
return (
<>
<a
href={skillProperties.link}
className='skills-link'
target='_blank'
rel='noopener noreferrer'
>
<div className='skills-content text-center'>
<Image
width={60}
height={60}
alt={skill}
src={skillProperties.image}
/>
<p className='skills-text'>{skill}</p>
</div>
</a>
<style jsx>{`
.skills-link {
max-width: 120px;
margin: 0px 10px 0 10px;
}
.skills-text {
margin-top: 5px;
}
`}
</style>
</>
<a
href={skillProperties.link}
className='mx-2 max-w-xl text-yellow hover:underline dark:text-yellow-dark'
target='_blank'
rel='noopener noreferrer'
>
<div className='text-center'>
<Image width={60} height={60} alt={skill} src={skillProperties.image} />
<p className='mt-1'>{skill}</p>
</div>
</a>
)
}