This commit is contained in:
Mackie 2026-06-01 17:25:55 +08:00
parent b57f9481d1
commit e512270017

View file

@ -36,13 +36,7 @@ export function SkillsBlock({ heading, keySkills, categories }: SkillsBlockProps
)} )}
{Array.isArray(categories) && categories.length > 0 && ( {Array.isArray(categories) && categories.length > 0 && (
<div <div className="border border-foreground/8 rounded-xl overflow-hidden grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3">
className="border border-foreground/8 rounded-xl overflow-hidden"
style={{
display: 'grid',
gridTemplateColumns: 'repeat(3, 1fr)',
}}
>
{categories.map((cat, i) => { {categories.map((cat, i) => {
const isLastRow = i >= categories.length - (categories.length % 3 || 3) const isLastRow = i >= categories.length - (categories.length % 3 || 3)
const isLastCol = (i + 1) % 3 === 0 const isLastCol = (i + 1) % 3 === 0
@ -55,17 +49,22 @@ export function SkillsBlock({ heading, keySkills, categories }: SkillsBlockProps
!isLastRow && 'border-b border-foreground/8', !isLastRow && 'border-b border-foreground/8',
)} )}
> >
<i className={`ti ${cat.icon} text-foreground/40`} style={{ fontSize: 20 }} aria-hidden="true" /> <i
className={`ti ${cat.icon} text-foreground/40`}
style={{ fontSize: 20 }}
aria-hidden="true"
/>
<p className="text-sm font-medium text-foreground/85">{cat.title}</p> <p className="text-sm font-medium text-foreground/85">{cat.title}</p>
<div className="flex flex-wrap gap-1.5"> <div className="flex flex-wrap gap-1.5">
{Array.isArray(cat.tags) && cat.tags.map(({ tag }, j) => ( {Array.isArray(cat.tags) &&
<span cat.tags.map(({ tag }, j) => (
key={j} <span
className="text-xs text-foreground/35 border border-foreground/10 rounded-full px-2.5 py-0.5" key={j}
> className="text-xs text-foreground/35 border border-foreground/10 rounded-full px-2.5 py-0.5"
{tag} >
</span> {tag}
))} </span>
))}
</div> </div>
</div> </div>
) )
@ -74,4 +73,4 @@ export function SkillsBlock({ heading, keySkills, categories }: SkillsBlockProps
)} )}
</section> </section>
) )
} }