rootadmin/multisite
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

box

Browse source
This commit is contained in:
Mackie 2026-06-03 10:26:41 +08:00
parent 06ba7b97d5
commit a04b3fd456
1 changed files with 24 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

57
src/blocks/Skills/Component.tsx
View file

@ -1,5 +1,4 @@
import React from 'react' import React from 'react'
import { cn } from '@/utilities/ui'
type SkillCategory = { type SkillCategory = {
title: string title: string
@ -36,39 +35,31 @@ export function SkillsBlock({ heading, keySkills, categories }: SkillsBlockProps
)} )}
{Array.isArray(categories) && categories.length > 0 && ( {Array.isArray(categories) && categories.length > 0 && (
<div className="border border-foreground/8 rounded-xl overflow-hidden grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3"> <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
{categories.map((cat, i) => { {categories.map((cat, i) => (
const isLastRow = i >= categories.length - (categories.length % 3 || 3) <div
const isLastCol = (i + 1) % 3 === 0 key={i}
return ( className="p-6 flex flex-col gap-3 rounded-xl bg-muted/50 border-0 shadow-none"
<div >
key={i} <i
className={cn( className={`ti ${cat.icon} text-foreground/40`}
'p-6 flex flex-col gap-3', style={{ fontSize: 20 }}
!isLastCol && 'border-r border-foreground/8', aria-hidden="true"
!isLastRow && 'border-b border-foreground/8', />
)} <p className="text-sm font-medium text-foreground/85">{cat.title}</p>
> <div className="flex flex-wrap gap-1.5">
<i {Array.isArray(cat.tags) &&
className={`ti ${cat.icon} text-foreground/40`} cat.tags.map(({ tag }, j) => (
style={{ fontSize: 20 }} <span
aria-hidden="true" key={j}
/> className="text-xs text-foreground/50 bg-background/50 border border-foreground/10 rounded-full px-2.5 py-0.5"
<p className="text-sm font-medium text-foreground/85">{cat.title}</p> >
<div className="flex flex-wrap gap-1.5"> {tag}
{Array.isArray(cat.tags) && </span>
cat.tags.map(({ tag }, j) => ( ))}
<span
key={j}
className="text-xs text-foreground/35 border border-foreground/10 rounded-full px-2.5 py-0.5"
>
{tag}
</span>
))}
</div>
</div> </div>
) </div>
})} ))}
</div> </div>
)} )}
</section> </section>