docs/agent/design/template-system.md
Resume template architecture and customization.
| Template | Layout | Best For |
|---|---|---|
| swiss-single | Full-width vertical | 1-2 page resumes |
| swiss-two-column | 65% main + 35% sidebar | Dense content |
components/resume/
├── index.ts # Re-exports all templates
├── resume-single-column.tsx # Single column template
└── resume-two-column.tsx # Two column template
interface TemplateSettings {
template: 'swiss-single' | 'swiss-two-column';
pageSize: 'A4' | 'LETTER';
marginTop: number; // 5-25mm
marginBottom: number;
marginLeft: number;
marginRight: number;
sectionSpacing: 1-5; // Inter-section gap
itemSpacing: 1-5; // Item gap
lineHeight: 1-5;
fontSize: 1-5; // Base font scale
headerScale: 1-5; // Header size scale
}
interface ResumeData {
personalInfo: PersonalInfo;
summary: string;
workExperience: Experience[];
education: Education[];
personalProjects: Project[];
additional: AdditionalInfo;
sectionMeta: SectionMeta[]; // Order, visibility
customSections: CustomSection[]; // User-added sections
}
Users can add custom sections via AddSectionDialog:
| Type | Component | Use Case |
|---|---|---|
| text | GenericTextForm | Objective, statement |
| itemList | GenericItemForm | Publications, research |
| stringList | GenericListForm | Hobbies, interests |
.resume-section /* Section wrapper */
.resume-section-title /* Section heading (h3) */
.resume-items /* Items container */
.resume-item /* Single entry (won't page-break) */
--section-spacing: calc(4px * var(--spacing-level));
--item-spacing: calc(2px * var(--spacing-level));
--line-height: calc(1.4 + 0.1 * var(--line-height-level));
components/resume/resume-{name}.tsxTemplateProps interfacecomponents/resume/index.tsFormattingControls selector