Restore anchor in skill component (#66)

This commit is contained in:
Szymon Kin 2022-10-26 21:39:28 +02:00 committed by GitHub
parent 0e3bb5f849
commit 8992b4244f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -8,12 +8,17 @@ import SkillLevel from './skill-level.astro';
export interface Props extends LevelledSkill {} export interface Props extends LevelledSkill {}
const { url, icon, iconColor, name, level } = Astro.props; const { url, icon, iconColor, name, level } = Astro.props;
const IconWrapper = url ? 'a' : 'div';
--- ---
<div class:list={['flex', 'flex-col', 'gap-2']}> <div class:list={['flex', 'flex-col', 'gap-2']}>
<div class:list={['flex', 'gap-2', 'h-5']}> <IconWrapper
<Icon client:load name={icon} color={iconColor} size={20} url={url} /> class:list={['flex', 'gap-2', 'h-5']}
{...(url && { href: url, target: "_blank", rel: "noopener noreferrer" })}
>
<Icon client:load name={icon} color={iconColor} size={20} />
<Typography variant="tile-subtitle" class="text-gray-700">{name}</Typography> <Typography variant="tile-subtitle" class="text-gray-700">{name}</Typography>
</div> </IconWrapper>
<SkillLevel skillLevel={level} /> <SkillLevel skillLevel={level} />
</div> </div>