juanatsap
9a848e8c53
Implement a command palette accessible via CMD+K/Ctrl+K using the ninja-keys web component. Features include: - New /api/cmd-k endpoint serving dynamic CV entries (experiences, projects, courses) - Language-aware responses with 1-hour cache headers - Scroll-to-section functionality for quick navigation - Enhanced keyboard shortcuts modal with CMD+K documentation - Comprehensive test coverage for API and UI interactions Also includes cleanup of deprecated debug test files and various UI polish improvements to contact form, themes, and action bar components.
104 lines
4.7 KiB
HTML
104 lines
4.7 KiB
HTML
{{define "section-projects"}}
|
|
<!-- Projects Section -->
|
|
{{if .CV.Projects}}
|
|
<section id="projects" class="cv-section component-wrapper">
|
|
<!-- Actual Content -->
|
|
<div class="actual-content">
|
|
<details open>
|
|
<summary>
|
|
<h3 class="section-title">
|
|
<iconify-icon icon="mdi:web" width="24" height="24" class="section-icon"></iconify-icon>
|
|
{{.UI.Navigation.Projects}}
|
|
</h3>
|
|
</summary>
|
|
{{range .CV.Projects}}
|
|
<div class="project-item" id="proj-{{.ProjectID}}" data-project="{{.ProjectID}}" data-title="{{if .ProjectName}}{{.ProjectName}}{{else}}{{.Title}}{{end}}">
|
|
{{if .ProjectLogo}}
|
|
<div class="project-icon">
|
|
<img src="/static/images/projects/{{.ProjectLogo}}" alt="{{.Title}} logo" onerror="this.parentElement.innerHTML='<iconify-icon icon=\'mdi:web\' width=\'80\' height=\'80\' class=\'default-project-icon\'></iconify-icon>'">
|
|
</div>
|
|
{{else}}
|
|
<div class="project-icon">
|
|
<iconify-icon icon="mdi:web" width="80" height="80" class="default-project-icon"></iconify-icon>
|
|
</div>
|
|
{{end}}
|
|
<div class="project-content">
|
|
<strong>
|
|
{{if .ProjectName}}
|
|
{{if .URL}}<a href="{{.URL}}" target="_blank" rel="noopener noreferrer">{{.ProjectName}}</a>{{else}}{{.ProjectName}}{{end}}{{if .ProjectDesc}} - {{.ProjectDesc}}{{end}}
|
|
{{else}}
|
|
{{if .URL}}<a href="{{.URL}}" target="_blank" rel="noopener noreferrer">{{.Title}}</a>{{else}}{{.Title}}{{end}}
|
|
{{end}}
|
|
</strong>
|
|
{{if .Current}}<span class="live-badge"><iconify-icon icon="mdi:wifi" width="14" height="14"></iconify-icon>LIVE</span>{{end}}
|
|
{{if .MaintainedBy}}<span class="maintained-badge">{{$.UI.Sections.MaintainedBy}} {{.MaintainedBy}}</span>{{end}}
|
|
<br>
|
|
<small>{{if .StartDate}}{{.StartDate}}{{if .Current}}{{if .DynamicDate}} / {{.DynamicDate}}{{else}} / {{$.UI.Sections.Present}}{{end}}{{end}}{{end}} - ({{.Location}})</small>
|
|
|
|
{{if .ShortDescription}}
|
|
<p class="project-desc short-desc">{{.ShortDescription | safeHTML}}</p>
|
|
{{end}}
|
|
|
|
{{if .Responsibilities}}
|
|
<ul class="responsibilities long-only">
|
|
{{range .Responsibilities}}
|
|
<li>{{. | safeHTML}}</li>
|
|
{{end}}
|
|
</ul>
|
|
{{end}}
|
|
|
|
{{if .Technologies}}
|
|
<div class="project-technologies long-only">
|
|
<strong>{{$.UI.Sections.Technologies}}</strong>
|
|
{{range $index, $tech := .Technologies}}{{if $index}}, {{end}}{{$tech}}{{end}}
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
|
|
<!-- Link to full portfolio -->
|
|
<div class="projects-footer">
|
|
<p>{{.UI.Portfolio.SeeAllProjects}}
|
|
<a href="{{.CV.Personal.Domestika}}" target="_blank" rel="noopener noreferrer"><strong>{{.UI.Portfolio.DomestikaPortfolio}}</strong></a></p>
|
|
</div>
|
|
</details>
|
|
</div>
|
|
|
|
<!-- Skeleton Content -->
|
|
<div class="skeleton-content">
|
|
<div class="skeleton-section">
|
|
<div class="skeleton skeleton-section-title"></div>
|
|
|
|
<!-- Project Item 1 - With responsibilities and technologies -->
|
|
<div class="skeleton-project-item">
|
|
<div class="skeleton skeleton-project-icon"></div>
|
|
<div class="skeleton-project-content">
|
|
<div class="skeleton skeleton-project-title-line"></div>
|
|
<div class="skeleton skeleton-date-line"></div>
|
|
<div class="skeleton skeleton-description-line"></div>
|
|
<div class="skeleton skeleton-responsibility-line"></div>
|
|
<div class="skeleton skeleton-responsibility-line" style="width: 93%;"></div>
|
|
<div class="skeleton skeleton-tech-line"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Project Item 2 - Shorter -->
|
|
<div class="skeleton-project-item">
|
|
<div class="skeleton skeleton-project-icon"></div>
|
|
<div class="skeleton-project-content">
|
|
<div class="skeleton skeleton-project-title-line"></div>
|
|
<div class="skeleton skeleton-date-line"></div>
|
|
<div class="skeleton skeleton-description-line" style="width: 88%;"></div>
|
|
<div class="skeleton skeleton-tech-line"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Projects footer -->
|
|
<div class="skeleton skeleton-footer-line"></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{{end}}
|
|
{{end}}
|