24 lines
540 B
Text
24 lines
540 B
Text
---
|
|
import type { SkillLevel } from '@/types/sections/skills-section.types';
|
|
|
|
export interface Props {
|
|
skillLevel: SkillLevel;
|
|
tileLevel: SkillLevel;
|
|
}
|
|
|
|
const { skillLevel, tileLevel } = Astro.props;
|
|
|
|
const isFilled = skillLevel >= tileLevel;
|
|
const classes = /* tw */ {
|
|
filled: 'bg-gray-500 dark:bg-gray-300',
|
|
empty: 'bg-gray-200 dark:bg-gray-500',
|
|
};
|
|
---
|
|
|
|
<div
|
|
class:list={[
|
|
'w-9 h-2 last:rounded-l-none last:rounded-r-sm first:rounded-l-sm first:rounded-r-none',
|
|
isFilled ? classes.filled : classes.empty,
|
|
]}
|
|
>
|
|
</div>
|