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 new skills

Browse Source
This commit is contained in:
divlo
2021-06-24 19:46:44 +02:00
parent f5bdd85b73
commit 235c072c21
11 changed files with 72 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
components/Skills/Skill.tsx
View File

@@ -1,14 +1,24 @@
import { useTheme } from 'next-themes'
import Image from 'next/image'
import { useMemo } from 'react'
import { skills } from './skills'
export interface SkillProps {
skill: keyof typeof skills
export interface SkillComponentProps {
skill: string
}
export const Skill: React.FC<SkillProps> = (props) => {
export const SkillComponent: React.FC<SkillComponentProps> = (props) => {
const { skill } = props
const skillProperties = skills[skill]
const { theme } = useTheme()
const image = useMemo(() => {
if (typeof skillProperties.image !== 'string') {
return skillProperties.image[theme ?? 'light']
}
return skillProperties.image
}, [skillProperties, theme])
return (
<a
@@ -18,7 +28,7 @@ export const Skill: React.FC<SkillProps> = (props) => {
rel='noopener noreferrer'
>
<div className='text-center'>
<Image width={60} height={60} alt={skill} src={skillProperties.image} />
<Image width={60} height={60} alt={skill} src={image} />
<p className='mt-1'>{skill}</p>
</div>
</a>