Ilia Mashkov
47 lines
1.1 KiB
TypeScript
47 lines
1.1 KiB
TypeScript
import { cn } from '$shared/lib';
|
|
|
|
type Props = {
|
|
/**
|
|
* Project year
|
|
*/
|
|
year: string;
|
|
/**
|
|
* Developer role on the project
|
|
*/
|
|
role: string;
|
|
/**
|
|
* Technology stack list
|
|
*/
|
|
stack: string[];
|
|
/**
|
|
* Additional CSS classes
|
|
*/
|
|
className?: string;
|
|
};
|
|
|
|
/**
|
|
* Sidebar metadata display for a project: year, role, and stack.
|
|
*/
|
|
export function ProjectMetadata({ year, role, stack, className }: Props) {
|
|
return (
|
|
<div className={cn('space-y-6', className)}>
|
|
<div>
|
|
<p className="text-xs uppercase tracking-wider opacity-60">YEAR</p>
|
|
<p className="text-base font-bold">{year}</p>
|
|
</div>
|
|
<div className="brutal-border-top pt-6">
|
|
<p className="text-xs uppercase tracking-wider opacity-60">ROLE</p>
|
|
<p className="text-base font-bold">{role}</p>
|
|
</div>
|
|
<div className="brutal-border-top pt-6">
|
|
<p className="text-xs uppercase tracking-wider opacity-60">STACK</p>
|
|
{stack.map((tech) => (
|
|
<p key={tech} className="text-sm">
|
|
{tech}
|
|
</p>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|