feat: Implement date tracking for skills

- Added `date_added` field to all skills in frontmatter.
- Updated Home page to display skill addition date alongside risk level.
- Enhanced Skill Detail page to show date added in a badge format.
- Created scripts for managing skill dates, including adding missing dates and generating reports.
- Updated validators to enforce date format compliance.
- Added comprehensive documentation on date tracking implementation and usage.
- Introduced a new skill template including the `date_added` field.
This commit is contained in:
Zied
2026-02-26 12:39:28 +01:00
parent 689a825411
commit f8123cb5a9
14 changed files with 5168 additions and 2361 deletions

View File

@@ -196,7 +196,14 @@ export function Home() {
{skill.description}
</p>
<div className="flex items-center text-sm font-medium text-indigo-600 dark:text-indigo-400 pt-4 mt-auto border-t border-slate-100 dark:border-slate-800 group-hover:translate-x-1 transition-transform">
<div className="flex items-center justify-between text-xs text-slate-400 dark:text-slate-500 mb-3 pb-3 border-b border-slate-100 dark:border-slate-800">
<span>Risk: <span className="font-semibold text-slate-600 dark:text-slate-300">{skill.risk || 'unknown'}</span></span>
{skill.date_added && (
<span className="ml-2">📅 {skill.date_added}</span>
)}
</div>
<div className="flex items-center text-sm font-medium text-indigo-600 dark:text-indigo-400 pt-2 mt-auto group-hover:translate-x-1 transition-transform">
Read Skill <ArrowRight className="ml-1 h-4 w-4" />
</div>
</Link>

View File

@@ -147,7 +147,7 @@ export function SkillDetail() {
<div className="p-6 sm:p-8 border-b border-slate-200 dark:border-slate-800 bg-slate-50/50 dark:bg-slate-950/50">
<div className="flex flex-col md:flex-row md:items-center justify-between gap-4">
<div>
<div className="flex items-center space-x-3 mb-2">
<div className="flex items-center space-x-3 mb-2 flex-wrap gap-2">
<span className="px-2.5 py-0.5 rounded-full text-xs font-semibold bg-indigo-100 text-indigo-700 dark:bg-indigo-900/50 dark:text-indigo-400 uppercase tracking-wide">
{skill.category}
</span>
@@ -156,6 +156,11 @@ export function SkillDetail() {
{skill.source}
</span>
)}
{skill.date_added && (
<span className="px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-700 dark:bg-green-900/50 dark:text-green-400">
📅 Added {skill.date_added}
</span>
)}
<button
onClick={handleStarClick}
className="flex items-center space-x-1.5 px-3 py-1 bg-yellow-50 dark:bg-yellow-900/10 hover:bg-yellow-100 dark:hover:bg-yellow-900/30 text-yellow-700 dark:text-yellow-500 rounded-full text-xs font-bold border border-yellow-200 dark:border-yellow-700/50 transition-colors"