94976e1c19
Position fix: - Remove _chat.css @import from main.css (was overriding with old left:2rem cached version). Chat CSS now loaded only via head-styles. - Button confirmed at right:2rem, bottom:6rem (above back-to-top) Help modal: - New chat-help-modal.html using same <dialog> pattern as shortcuts - 6 organized categories: Experience, Technologies, Projects, Education, Skills, How it works - Bilingual EN/ES with example questions per category - ? button in header opens modal via commandfor/show-modal - Removed inline help card (modal replaces it) Intelligence: - Comprehensive query strategy for 8 question types - Technology queries always use cross-section search - Company queries use experience without filter for full listing - Agent knows CV site is built with Go/HTMX (bonus context) - Skills report proficiency levels when technology found
144 lines
8.4 KiB
HTML
144 lines
8.4 KiB
HTML
{{define "chat-help-modal"}}
|
|
<!-- Chat Help Modal - Native Dialog -->
|
|
<dialog id="chat-help-modal" class="info-modal no-print"
|
|
_="on click call closeOnBackdrop(me, event)">
|
|
<div class="info-modal-content">
|
|
<button class="info-modal-close" commandfor="chat-help-modal" command="close" aria-label="{{if eq .Lang "es"}}Cerrar{{else}}Close{{end}}">
|
|
<iconify-icon icon="mdi:close" width="24" height="24"></iconify-icon>
|
|
</button>
|
|
|
|
<div class="info-modal-header">
|
|
<h2>{{if eq .Lang "es"}}Asistente del CV{{else}}CV Assistant{{end}}</h2>
|
|
<div class="info-modal-cv-title">
|
|
<span class="keyboard-icon-wrapper">
|
|
<iconify-icon icon="mdi:robot-happy-outline" width="32" height="32"></iconify-icon>
|
|
</span>
|
|
{{if eq .Lang "es"}}Asistente inteligente con IA{{else}}AI-powered assistant{{end}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="info-modal-body">
|
|
<p class="info-modal-description">
|
|
{{if eq .Lang "es"}}Un asistente con inteligencia artificial que puede responder preguntas sobre este CV. Consulta experiencia profesional, proyectos, habilidades, formación y más — todo basado en datos reales del CV.{{else}}An AI-powered assistant that can answer questions about this CV. Query professional experience, projects, skills, education, and more — all based on actual CV data.{{end}}
|
|
</p>
|
|
|
|
<!-- About Experience -->
|
|
<div class="shortcuts-section">
|
|
<h3 class="shortcuts-section-title">
|
|
<iconify-icon icon="mdi:briefcase-outline" width="20" height="20"></iconify-icon>
|
|
{{if eq .Lang "es"}}Sobre Experiencia{{else}}About Experience{{end}}
|
|
</h3>
|
|
<div class="shortcuts-list">
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Cuántos años de experiencia tiene Juan?{{else}}How many years of experience does Juan have?{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿En qué empresas ha trabajado?{{else}}What companies has he worked at?{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}Cuéntame sobre su paso por Olympic Broadcasting{{else}}Tell me about his time at Olympic Broadcasting{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Qué hacía en SAP?{{else}}What did he do at SAP?{{end}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- About Technologies -->
|
|
<div class="shortcuts-section">
|
|
<h3 class="shortcuts-section-title">
|
|
<iconify-icon icon="mdi:code-tags" width="20" height="20"></iconify-icon>
|
|
{{if eq .Lang "es"}}Sobre Tecnologías{{else}}About Technologies{{end}}
|
|
</h3>
|
|
<div class="shortcuts-list">
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Qué lenguajes de programación conoce?{{else}}What programming languages does he know?{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Ha trabajado con React? ¿Dónde?{{else}}Has he worked with React? Where?{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Cuál es su experiencia con Go?{{else}}What's his Go experience?{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Conoce Node.js?{{else}}Does he know Node.js?{{end}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- About Projects -->
|
|
<div class="shortcuts-section">
|
|
<h3 class="shortcuts-section-title">
|
|
<iconify-icon icon="mdi:rocket-launch-outline" width="20" height="20"></iconify-icon>
|
|
{{if eq .Lang "es"}}Sobre Proyectos{{else}}About Projects{{end}}
|
|
</h3>
|
|
<div class="shortcuts-list">
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Qué proyectos personales ha creado?{{else}}What personal projects has he built?{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}Cuéntame sobre Immich Photo Manager{{else}}Tell me about the Immich Photo Manager{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Qué proyectos open-source mantiene?{{else}}What open-source projects does he maintain?{{end}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- About Education & Certifications -->
|
|
<div class="shortcuts-section">
|
|
<h3 class="shortcuts-section-title">
|
|
<iconify-icon icon="mdi:school-outline" width="20" height="20"></iconify-icon>
|
|
{{if eq .Lang "es"}}Formación y Certificaciones{{else}}Education & Certifications{{end}}
|
|
</h3>
|
|
<div class="shortcuts-list">
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Qué certificaciones tiene?{{else}}What certifications does he have?{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Dónde estudió?{{else}}Where did he study?{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Qué cursos ha completado?{{else}}What courses has he completed?{{end}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- About Skills -->
|
|
<div class="shortcuts-section">
|
|
<h3 class="shortcuts-section-title">
|
|
<iconify-icon icon="mdi:star-outline" width="20" height="20"></iconify-icon>
|
|
{{if eq .Lang "es"}}Sobre Habilidades{{else}}About Skills{{end}}
|
|
</h3>
|
|
<div class="shortcuts-list">
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Cuáles son sus principales habilidades técnicas?{{else}}What are his main technical skills?{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Tiene experiencia con Docker?{{else}}Does he have experience with Docker?{{end}}</span>
|
|
</div>
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">{{if eq .Lang "es"}}¿Qué hay de CI/CD?{{else}}What about CI/CD?{{end}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- How it works -->
|
|
<div class="shortcuts-section">
|
|
<h3 class="shortcuts-section-title">
|
|
<iconify-icon icon="mdi:information-outline" width="20" height="20"></iconify-icon>
|
|
{{if eq .Lang "es"}}Cómo funciona{{else}}How it works{{end}}
|
|
</h3>
|
|
<div class="shortcuts-list">
|
|
<div class="shortcut-item">
|
|
<span class="shortcut-desc">
|
|
{{if eq .Lang "es"}}Impulsado por Google ADK Go 1.0 y Gemini AI. Las preguntas se responden consultando los datos reales del CV — sin alucinaciones, siempre preciso.{{else}}Powered by Google ADK Go 1.0 and Gemini AI. Questions are answered by querying the actual CV data — no hallucination, always accurate.{{end}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</dialog>
|
|
{{end}}
|