.*?<\/div>/g) || []
+
+ // Process each entry with its formatted citation
+ const publications = cite.data.map((entry, index) => {
+ console.log(`[Debug] Entry ${index} type:`, entry.type)
+
+ // Format individual citation
+ const singleCite = new Cite(entry)
+ const formattedHTML = singleCite.format('bibliography', {
+ format: 'html',
+ template: 'ieee',
+ lang: 'en-US'
+ })
+
+ // Clean up the HTML structure
+ const processedHTML = formattedHTML
+ .replace(/\r?\n|\r/g, '') // Remove all newlines
+ .replace(/>\s+<') // Remove whitespace between tags
+ .replace(/\s+/g, ' ') // Replace multiple spaces with single space
+ .replace(/, doi: .*?(?=<\/div>)/g, '') // Remove DOI from citation text
+ .trim() // Remove leading/trailing whitespace
+
+ const pubType = PUBLICATION_TYPE_MAP[entry.type] || 'other'
+ const pub = {
+ name: entry.title,
+ publisher: entry['container-title'] || entry.journal || '',
+ releaseDate: entry.issued?.['date-parts']?.[0]?.[0]?.toString() || entry.year?.toString() || '',
+ url: entry.DOI ? `https://doi.org/${entry.DOI}` : entry.URL || '',
+ type: pubType,
+ formattedHTML: `
${processedHTML}
`,
+ citationKey: entry.id,
+ bibtexEntry: entry,
+ source: 'bibtex'
+ }
+ return pub
+ })
+
+ // Create a new CV data object with updated publications
+ const newCvData = { ...cvData }
+
+ if (shouldReplace) {
+ // In replace mode, use only BibTeX publications
+ newCvData.publications = publications
+ } else {
+ // In merge mode, combine with existing publications
+ newCvData.publications = [...(cvData.publications || []), ...publications]
+ }
+
+ // Sort all publications by release date (newest first)
+ newCvData.publications.sort((a, b) => {
+ const dateA = a.releaseDate ? new Date(a.releaseDate) : new Date(0);
+ const dateB = b.releaseDate ? new Date(b.releaseDate) : new Date(0);
+ return dateB - dateA;
+ });
+
+ console.log('[Debug] CV publications after update:', {
+ mode: shouldReplace ? 'replace' : 'merge',
+ total: newCvData.publications.length,
+ fromBibtex: publications.length,
+ })
+ console.log(newCvData)
+
+ return newCvData
+ } catch (error) {
+ console.error('[Error] Failed to process BibTeX:', error)
+ return cvData
+ }
+}
+
+/**
+ * Get the last uploaded BibTeX data
+ */
+export function getLastBibTeX() {
+ return lastBibTeX
+}
+
+/**
+ * Parse stringified publication if needed
+ */
+function _parsePublication(pub) {
+ if (typeof pub === 'string') {
+ try {
+ return JSON.parse(pub)
+ } catch (e) {
+ console.error('Failed to parse publication:', e)
+ return pub
+ }
+ }
+ return pub
+}
+
+/**
+ * Update publications in CV data (for backward compatibility)
+ */
+export function updatePublications(cvData, publications, shouldReplace = false) {
+ // Just pass through to processBibTeX if we have BibTeX data
+ if (lastBibTeX) {
+ return processBibTeX(lastBibTeX, cvData, shouldReplace)
+ }
+ return cvData
+}
\ No newline at end of file
diff --git a/src/lib/date.js b/src/lib/date.js
index a0b4068..c67df5f 100644
--- a/src/lib/date.js
+++ b/src/lib/date.js
@@ -1,5 +1,8 @@
import dayjs from 'dayjs';
export function reformatDate(dateStr, toFormat, fromFormat = 'YYYY-MM-DD') {
+ if (!dateStr) return ''
+ const lower = dateStr.toLowerCase()
+ if (lower === 'present' || lower === 'now') return 'Present'
return dayjs(dateStr).format(toFormat)
}
diff --git a/src/lib/store.js b/src/lib/store.js
index 90a7c0f..76ecffd 100644
--- a/src/lib/store.js
+++ b/src/lib/store.js
@@ -1,35 +1,44 @@
-export const storeKeys = {
- cvJSON: 'cvJSON',
- cvSavedTime: 'cvSavedTime',
- primaryColor: 'primary-color',
-}
-
-const defaultPrimaryColor = '#2A3FFB'
-
-function updateSavedTime() {
- localStorage.setItem(storeKeys.cvSavedTime, Date.now())
-}
+const storeKeyCV = 'cv-data'
+const storeKeyCVSavedTime = 'cv-data-saved-time'
+const storeKeyPrimaryColor = 'primary-color'
+const storeKeyPageSize = 'page-size'
+const storeKeyTheme = 'theme'
-export function saveCVJSON(str) {
- localStorage.setItem(storeKeys.cvJSON, str)
- updateSavedTime()
+export function saveCVJSON(json) {
+ localStorage.setItem(storeKeyCV, json)
+ localStorage.setItem(storeKeyCVSavedTime, Date.now().toString())
}
export function getCVData() {
- const v = localStorage.getItem(storeKeys.cvJSON)
- if (!v) return
- return JSON.parse(v)
+ const json = localStorage.getItem(storeKeyCV)
+ if (!json) return null
+ return JSON.parse(json)
}
export function getCVSavedTime() {
- return localStorage.getItem(storeKeys.cvSavedTime)
+ return localStorage.getItem(storeKeyCVSavedTime)
}
export function savePrimaryColor(color) {
- localStorage.setItem(storeKeys.primaryColor, color)
- updateSavedTime()
+ localStorage.setItem(storeKeyPrimaryColor, color)
}
export function getPrimaryColor() {
- return localStorage.getItem(storeKeys.primaryColor) || defaultPrimaryColor
+ return localStorage.getItem(storeKeyPrimaryColor) || '#aaaaaa'
+}
+
+export function savePageSize(size) {
+ localStorage.setItem(storeKeyPageSize, size)
+}
+
+export function getPageSize() {
+ return localStorage.getItem(storeKeyPageSize) || 'A4'
+}
+
+export function saveTheme(theme) {
+ localStorage.setItem(storeKeyTheme, theme)
+}
+
+export function getTheme() {
+ return localStorage.getItem(storeKeyTheme) || 'reorx'
}
diff --git a/src/preview/main.js b/src/preview/main.js
index cbcaeb2..b392f1a 100644
--- a/src/preview/main.js
+++ b/src/preview/main.js
@@ -2,6 +2,8 @@ import {
getCVData,
getCVSavedTime,
getPrimaryColor,
+ getPageSize,
+ getTheme,
} from '../lib/store';
import { upsertStyleTag } from '../lib/utils';
import cvBaseStyle from '../scss/cv-base.css?inline';
@@ -36,9 +38,14 @@ const restoreScrollPosition = () => {
// Render CV
const data = getCVData()
if (data) {
+ // Set page size
+ const pageSize = data.meta?.pageSize || getPageSize()
+ document.documentElement.dataset.pageSize = pageSize.toLowerCase()
upsertStyleTag('base-style', cvBaseStyle)
- renderThemeOn(themeName, elCV, data, getPrimaryColor())
+ // Use theme from meta or storage
+ const theme = data.meta?.theme || getTheme()
+ renderThemeOn(theme, elCV, data, getPrimaryColor())
// change document title
document.title = getCVTitle(data)
diff --git a/src/scss/cv-base.css b/src/scss/cv-base.css
index 84fc2f5..0b828ce 100644
--- a/src/scss/cv-base.css
+++ b/src/scss/cv-base.css
@@ -1,23 +1,73 @@
/* Mandatory page setup for all themes */
+:root {
+ /* A4: 210mm x 297mm */
+ /* Letter: 215.9mm x 279.4mm */
+ --page-width: 210mm; /* default A4 */
+ --page-height: 297mm; /* default A4 */
+ --page-margin: 10mm;
+}
+
+:root[data-page-size="letter"] {
+ --page-width: 215.9mm;
+ --page-height: 279.4mm;
+}
+
@page {
- /* A4 */
- /* size: 210mm 297mm; */
- size: A4;
- margin: 10mm; /* approximately 0.4in */
+ size: var(--page-width) var(--page-height);
+ margin: var(--page-margin);
}
/* simulate print page size */
.cv-container {
- width: calc(210mm - 20mm);
- padding: 10mm;
+ width: calc(var(--page-width) - 2 * var(--page-margin));
+ min-height: calc(var(--page-height) - 2 * var(--page-margin));
+ padding: var(--page-margin);
+ margin: 0 auto; /* center the container */
+ background: white;
+ box-sizing: border-box;
+ position: relative;
+}
+
+/* Add page size indicator */
+.cv-container::before {
+ content: "A4";
+ position: fixed;
+ top: 5px;
+ right: 5px;
+ background: #f0f0f0;
+ padding: 2px 6px;
+ border-radius: 3px;
+ font-size: 12px;
+ opacity: 0.7;
+}
+
+:root[data-page-size="letter"] .cv-container::before {
+ content: "Letter";
}
+
@media print {
- /* remove the printing simulations and common decorations , let @page decide the size and margin */
- .cv-container {
+ .cv-container::before {
+ display: none;
+ }
+
+ @page {
+ size: var(--page-width) var(--page-height);
+ margin: var(--page-margin);
+ }
+
+ html, body {
+ width: var(--page-width);
+ height: var(--page-height);
margin: 0;
padding: 0;
+ }
+
+ .cv-container {
+ width: 100%;
+ min-height: 100%;
+ margin: 0;
+ padding: var(--page-margin);
border: 0;
- width: auto;
}
}
diff --git a/src/scss/editor/index.scss b/src/scss/editor/index.scss
index f6b2c4e..30e6a88 100644
--- a/src/scss/editor/index.scss
+++ b/src/scss/editor/index.scss
@@ -112,14 +112,32 @@ button {
}
}
}
+
+ .theme-picker {
+ @include vars.button-base;
+ border: 1px solid var(--grey-2);
+ border-radius: 2px;
+ padding: 3px 8px;
+ font-size: 13px;
+ display: block;
+ width: 85px;
+
+ select {
+ width: 100%;
+ margin-top: 4px;
+ padding: 2px;
+ }
+ }
}
.output-html {
// set a fixed size so that responsive styles won't be applied in the iframe
- width: 795px; // 210mm ≈ 793px
+ width: 875px; // 795px * 1.1 ≈ 875px
height: 100%;
- margin: 0; padding: 0; border: 0;
+ margin: 0; // remove auto margin since we're in a grid
+ padding: 0; border: 0;
border-right: 1px solid var(--grey-2);
+ display: block;
}
.output-json {
@@ -150,3 +168,65 @@ dialog {
background-color: transparent;
}
}
+
+.bibtex-controls {
+ margin: 5px 0;
+
+ .bibtex-mode {
+ margin-top: 4px;
+ display: flex;
+ gap: 12px;
+ justify-content: center;
+ font-size: 0.9em;
+
+ label {
+ display: flex;
+ align-items: center;
+ gap: 4px;
+ cursor: pointer;
+
+ input[type="radio"] {
+ margin: 0;
+ cursor: pointer;
+ }
+ }
+ }
+}
+
+.publications-box {
+ margin: 12px 0;
+ padding: 6px 8px;
+ border: 1px solid var(--grey-2);
+ border-radius: 4px;
+
+ .box-title {
+ font-weight: 500;
+ margin-bottom: 6px;
+ padding-bottom: 3px;
+ border-bottom: 1px solid var(--grey-2);
+ }
+
+ button {
+ margin-bottom: 4px;
+ }
+
+ .bibtex-mode {
+ display: flex;
+ flex-direction: column;
+ gap: 3px;
+ margin-top: 2px;
+ font-size: 0.9em;
+
+ label {
+ display: flex;
+ align-items: center;
+ gap: 4px;
+ cursor: pointer;
+
+ input[type="radio"] {
+ margin: 0;
+ cursor: pointer;
+ }
+ }
+ }
+}
diff --git a/src/themes/cuiv/index.ejs b/src/themes/cuiv/index.ejs
new file mode 100644
index 0000000..f3bdaac
--- /dev/null
+++ b/src/themes/cuiv/index.ejs
@@ -0,0 +1,804 @@
+<%
+function linkInDiv(url) {
+ if (!url) return ''
+ return `
`
+}
+
+// Format citation from structured data
+function formatCitation(pub, index) {
+ // If we have pre-formatted HTML (from BibTeX), use it but replace the number
+ if (pub.formattedHTML) {
+ // Replace any number in [x] with current index + 1
+ return pub.formattedHTML.replace(/\[\d+\]/, `[${index + 1}]`);
+ }
+
+ // Otherwise format from structured data
+ const parts = [];
+ if (pub.authors && pub.authors.length > 0) {
+ parts.push(pub.authors.join(', '));
+ }
+ if (pub.name) parts.push(`"${pub.name}"`);
+ if (pub.publisher) parts.push(pub.publisher);
+ if (pub.releaseDate) parts.push(pub.releaseDate);
+
+ // Return formatted HTML with the same structure as Citation.js output
+ return `
[${index + 1}]
${parts.join(', ')}
`;
+}
+
+function formatLocation(loc) {
+ const cityToCountry = ['city', 'region', 'postalCode', 'countryCode'].map(key => loc[key]).filter(v => v).join(', ')
+ if (!loc.address) return cityToCountry
+ return `${loc.address}, ${cityToCountry}`
+}
+
+function hasItems(arr) {
+ return Array.isArray(arr) && arr.length > 0
+}
+
+function dateRange(item, level) {
+ let {startDate, endDate} = item
+ if (!startDate && !endDate) return ''
+ let format
+ // level: 1: year, 2: month, 3: day
+ switch (level) {
+ case 1:
+ format = 'YYYY'
+ break;
+ case 2:
+ format = 'MMM YYYY'
+ break;
+ }
+ if (format) {
+ startDate = startDate ? fn.reformatDate(startDate, format) : ''
+ endDate = endDate ? fn.reformatDate(endDate, format) : ''
+ }
+ let result = ''
+ if (startDate && endDate) {
+ result = `${startDate} – ${endDate}`
+ } else if (startDate) {
+ result = `${startDate} – Present`
+ } else if (endDate) {
+ result = `Until ${endDate}`
+ }
+ return `
${result}
`
+}
+
+function date(item, level) {
+ let {date} = item
+ if (!date) return ''
+ let format
+ // level: 1: year, 2: month, 3: day
+ switch (level) {
+ case 1:
+ format = 'YYYY'
+ break;
+ case 2:
+ format = 'MMM YYYY'
+ break;
+ }
+ if (format) {
+ date = date ? fn.reformatDate(date, format) : ''
+ }
+ return `
${date}
`
+}
+%>
+
+
+ ☀️
+ 🌙
+
+
+
+
+ <%= cv.basics.name %>
+ <% if (cv.basics.label) { %>
+ <%= cv.basics.label %>
+ <% } %>
+
+
+ <% if (cv.basics.summary) { %>
+ <%- fn.renderMarkdown(cv.basics.summary) %>
+ <% } %>
+
+
+
+ <% if (hasItems(cv.education)) { %>
+
+
+ <% for (const item of cv.education) { %>
+
+
+
<%= item.institution %>
+
+
+
+ <%= item.studyType %> <%= item.area %>
+
+
+ <%
+ const startYear = item.startDate ? item.startDate.split('-')[0] : '';
+ const endYear = item.endDate === 'Present' ? 'Present' :
+ item.endDate ? item.endDate.split('-')[0] : '';
+ %>
+ <%= startYear %><% if (startYear && endYear) { %> - <% } %><%= endYear %>
+
+
+ <% if (item.score) { %>
Overall GPA: <%= item.score %>
<% } %>
+ <% if (item.dissertation) { %>
+
Dissertation: <%= item.dissertation %>
+ <% } %>
+ <% if (item.thesis) { %>
+
Thesis: <%= item.thesis %>
+ <% } %>
+ <% if (item.courses && item.courses.length > 0) { %>
+
+ Courses: <%= item.courses.join('; ') %>
+
+ <% } %>
+
+ <% } %>
+
+
+ <% if (hasItems(cv.work)) { %>
+
+
+ <% for (const item of cv.work) { %>
+
+ <% if (item.name !== (cv.work[cv.work.indexOf(item) - 1] || {}).name) { %>
+
+
<%= item.name %>
+
+ <% } %>
+
+
<%= item.position %>
+
+ <%
+ const startYear = item.startDate ? item.startDate.split('-')[0] : '';
+ const endYear = item.endDate === 'Present' ? 'Present' :
+ item.endDate ? item.endDate.split('-')[0] : 'Present';
+ %>
+ <%= startYear %><% if (startYear && endYear) { %> - <% } %><%= endYear %>
+
+
+
<%- fn.renderMarkdown(item.summary) %>
+ <% if (item.highlights && item.highlights.length > 0) { %>
+
+
+ <% for (const hl of item.highlights) { %>
+ <%- fn.renderMarkdown(hl, true) %>
+ <% } %>
+
+
+ <% } %>
+
+ <% } %>
+
+
+ <% if (hasItems(cv.researchAreas)) { %>
+
+
+ <% for (const item of cv.researchAreas) { %>
+
+
<%= item.name %>
+ <% if (item.description) { %>
+
<%- fn.renderMarkdown(item.description) %>
+ <% } %>
+ <% if (item.keywords && Array.isArray(item.keywords) && item.keywords.length > 0) { %>
+
+ <% for (const kw of item.keywords) { %>
+ <%= kw %>
+ <% } %>
+
+ <% } %>
+
+ <% } %>
+
+
+ <%
+ // Group publications by type, defaulting to 'other' if type not specified
+ const journalPubs = cv.publications?.filter(p => p.type === 'journal') || []
+ const conferencePubs = cv.publications?.filter(p => p.type === 'conference') || []
+ const otherPubs = cv.publications?.filter(p => !p.type || p.type === 'other') || []
+
+ // Only show section if there are publications
+ if (hasItems(journalPubs) || hasItems(conferencePubs) || hasItems(otherPubs)) {
+ %>
+
+
+
+ <% if (hasItems(journalPubs)) { %>
+
+
Journal Papers
+ <% for (let i = 0; i < journalPubs.length; i++) { %>
+
+
<%- formatCitation(journalPubs[i], i) %>
+ <%- linkInDiv(journalPubs[i].url) %>
+
+ <% } %>
+
+
Conference Papers
+ <% for (let i = 0; i < conferencePubs.length; i++) { %>
+
+
<%- formatCitation(conferencePubs[i], i) %>
+ <%- linkInDiv(conferencePubs[i].url) %>
+
+ <% } %>
+
+
Other Publications
+ <% for (let i = 0; i < otherPubs.length; i++) { %>
+
+
<%- formatCitation(otherPubs[i], i) %>
+ <%- linkInDiv(otherPubs[i].url) %>
+
+ <% } %>
+
+ <% } %>
+
+
+ <% if (hasItems(cv.projects)) { %>
+
+
+ <% for (const item of cv.projects) { %>
+
+
+
<%= item.name %>
+ <%- linkInDiv(item.url) %>
+
+
+ <% if (item.roles && item.roles.length > 0) { %>
+
<%= item.roles.join(', ') %>
+ <% } %>
+ <%- dateRange(item, 2) %>
+
+
<%- fn.renderMarkdown(item.description, true) %>
+ <% if (item.highlights && item.highlights.length > 0) { %>
+ <% if (item.highlights.length === 1) { %>
+
<%- fn.renderMarkdown(item.highlights[0], true) %>
+ <% } else { %>
+
+
+ <% for (const hl of item.highlights) { %>
+ <%- fn.renderMarkdown(hl, true) %>
+ <% } %>
+
+
+ <% } %>
+ <% } %>
+ <% if (item.keywords && Array.isArray(item.keywords) && item.keywords.length > 0) { %>
+
+ <% for (const kw of item.keywords) { %>
+ <%= kw %>
+ <% } %>
+
+ <% } %>
+
+ <% } %>
+
+
+ <% if (hasItems(cv.teaching)) { %>
+
+
+
Teaching Experience
+
+
+
+
+
<%= item.courseCode %>
+
<%= item.courseName %>
+
+
<%= item.terms.join(', ') %>
+
+ <% if (item.description) { %>
+
<%- fn.renderMarkdown(item.description) %>
+ <% } %>
+
+ <% } %>
+
+
+ <% if (cv.mentoring) { %>
+
+
+
+ <% if (hasItems(cv.mentoring.current_students)) { %>
+ Current Students
+
+
+ <% const phd_students = cv.mentoring.current_students.filter(s => s.level === 'Ph.D.') %>
+ <% if (phd_students.length > 0) { %>
+ Ph.D. Students
+ <% for (const student of phd_students) { %>
+
+
+
+ <% if (student.startDate) { %>
+
Since <%= student.startDate %>
+ <% } %>
+
+ <% if (student.dissertation) { %>
+
+
Dissertation: <%= student.dissertation %>
+
+ <% } %>
+
Master's Students
+ <% for (const student of ms_students) { %>
+
+
+
+ <% if (student.startDate) { %>
+
Since <%= student.startDate %>
+ <% } %>
+
+
+ <% if (student.type) { %>
+
<%= student.type %> Program
+ <% } %>
+ <% if (student.type === 'Thesis' && student.thesis_title) { %>
+
Thesis: <%= student.thesis_title %>
+ <% } %>
+
+
Undergraduate Researchers
+ <% for (const student of ug_students) { %>
+
+
+
+ <% if (student.period) { %>
+
<%= student.period %>
+ <% } %>
+
+ <% if (student.program) { %>
+
+
<%= student.program %>
+
+ <% } %>
+
Ph.D. Committee Service
+ <% const current = cv.mentoring.committee_service.filter(s => s.status === 'Current') %>
+ <% const completed = cv.mentoring.committee_service.filter(s => s.status === 'Completed') %>
+
+ <% if (current.length > 0) { %>
+ Current
+ <% for (const student of current) { %>
+
+
+
<%= student.name %>
+
<%= student.institution %>
+
+
+
Dissertation: <%= student.dissertation %>
+
+
Completed
+ <% for (const student of completed) { %>
+
+
+
<%= student.name %>
+
<%= student.institution %>
+
+
+
Dissertation: <%= student.dissertation %>
+ <% if (student.completionDate) { %>
+
Completed: <%= student.completionDate %>
+ <% } %>
+
+
Past Students
+ <% for (const student of cv.mentoring.past_students) { %>
+
+
+
+
<%= student.level %>
+
+
+
<%= student.institution %>
+ <% if (student.startDate || student.endDate) { %>
+
+ <%= student.startDate || '' %><% if (student.startDate && student.endDate) { %> - <% } %><%= student.endDate || '' %>
+
+ <% } %>
+ <% if (student.level === 'Ph.D.' && student.dissertation) { %>
+
Dissertation: <%= student.dissertation %>
+ <% } %>
+ <% if (student.level === 'M.S.') { %>
+ <% if (student.type) { %>
+
<%= student.type %> Program
+ <% } %>
+ <% if (student.type === 'Thesis' && student.thesis_title) { %>
+
Thesis: <%= student.thesis_title %>
+ <% } %>
+ <% } %>
+ <% if (student.level === 'Undergraduate' && student.program) { %>
+
<%= student.program %>
+ <% } %>
+ <% if (student.placement) { %>
+
+ <% if (student.placement.position && student.placement.organization) { %>
+ Currently <%= student.placement.position %> at <%= student.placement.organization %>
+ <% if (student.placement.location) { %>
+ , <%= student.placement.location %>
+ <% } %>
+ <% } else { %>
+ <% if (student.placement.position) { %>
+ Currently <%= student.placement.position %>
+ <% } %>
+ <% if (student.placement.organization) { %>
+ at <%= student.placement.organization %>
+ <% } %>
+ <% if (student.placement.location) { %>
+ , <%= student.placement.location %>
+ <% } %>
+ <% } %>
+
+ <% } %>
+
+
+ <% } %>
+
+
+ <% if (cv.presentations) { %>
+
+
+
+ <% if (hasItems(cv.presentations.invitedTalks)) { %>
+ Invited Talks
+ <% for (const item of cv.presentations.invitedTalks) { %>
+
+
+
<%= item.title || 'TBD' %>
+ <%- date(item, 2) %>
+
+
+ <%= item.venue %> (<%= item.type %>)
+
+ <% if (item.description) { %>
+
<%- fn.renderMarkdown(item.description) %>
+ <% } %>
+
Conference Presentations
+ <% for (const item of cv.presentations.conferences) { %>
+
+
+
<%= item.title %>
+ <%- date(item, 2) %>
+
+
+ <%= item.venue %> (<%= item.type %>)
+ <% if (item.location) { %> - <%= item.location %><% } %>
+
+ <% if (item.description) { %>
+
<%- fn.renderMarkdown(item.description) %>
+ <% } %>
+ <%- linkInDiv(item.url) %>
+
Outreach Activities
+ <% for (const item of cv.presentations.outreach) { %>
+
+
+
<%= item.activity %>
+ <%- date(item, 2) %>
+
+ <% if (item.description) { %>
+
<%- fn.renderMarkdown(item.description) %>
+ <% } %>
+ <%- linkInDiv(item.url) %>
+
+ <% } %>
+
+
+ <% if (hasItems(cv.awards)) { %>
+
+
+ <% for (const item of cv.awards) { %>
+
+
+
<%= item.title %>
+ <%- date(item, 2) %>
+
+
<%= item.awarder %>
+ <% if (item.summary) { %>
+
<%- fn.renderMarkdown(item.summary) %>
+ <% } %>
+
+ <% } %>
+
+
+ <% if (cv.services) { %>
+
+
+
Professional Services
+
+
Editorial Service
+ <% for (const item of cv.services.editorialBoards) { %>
+
+
+
<%= item.role %>
+
<%= item.period %>
+
+
<%= item.journal %>
+ <% if (item.details) { %>
+
<%- fn.renderMarkdown(item.details) %>
+ <% } %>
+
Society Service
+ <% for (const item of cv.services.societyServices) { %>
+
+
+
<%= item.role %>
+
<%= item.period %>
+
+
<%= item.organization %>
+
Review Service
+ <% for (const item of cv.services.reviewServices) { %>
+
+
+
<%= item.type %>
+
<%= item.year %>
+
+
<%= item.organization %>
+ <% if (item.details) { %>
+
<%- fn.renderMarkdown(item.details) %>
+ <% } %>
+
Department Service
+ <% for (const item of cv.services.departmental) { %>
+
+
+
<%= item.role %>
+
<%= item.period %>
+
+
<%= item.committee %>
+
+ <% } %>
+
+
+ <% if (hasItems(cv.certificates)) { %>
+
+
+ <% for (const item of cv.certificates) { %>
+
+
+
<%= item.name %>
+ <%- date(item, 2) %>
+
+
<%= item.issuer %>
+ <%- linkInDiv(item.url) %>
+
+ <% } %>
+
+
+ <% if (hasItems(cv.skills)) { %>
+
+
+
+ <% for (const item of cv.skills) { %>
+
+
<%= item.name %>
+
<%= item.level %>
+ <% if (item.summary) { %>
+
<%- fn.renderMarkdown(item.summary) %>
+ <% } %>
+ <% if (item.keywords && Array.isArray(item.keywords) && item.keywords.length > 0) { %>
+
+ <% for (const kw of item.keywords) { %>
+ <%= kw %>
+ <% } %>
+
+ <% } %>
+
+ <% } %>
+
+ <% } %>
+
+
+ <% if (hasItems(cv.languages)) { %>
+
+
+
+ <% for (const item of cv.languages) { %>
+
+
<%= item.language %>
+
<%= item.fluency %>
+ <% if (item.summary) { %>
+
<%- fn.renderMarkdown(item.summary) %>
+ <% } %>
+
+ <% } %>
+
+ <% } %>
+
+
+ <% if (cv.meta) { %>
+
+ <% if (cv.meta.version) { %>
+ Version: <%= cv.meta.version %>
+ <% } %>
+ <% if (cv.meta.lastModified) { %>
+ Last modified: <%= cv.meta.lastModified.slice(0, 10) %>
+ <% } %>
+
+ <% } %>
\ No newline at end of file
diff --git a/src/themes/cuiv/index.js b/src/themes/cuiv/index.js
new file mode 100644
index 0000000..82f8416
--- /dev/null
+++ b/src/themes/cuiv/index.js
@@ -0,0 +1,81 @@
+import ejs from 'ejs';
+import { upsertStyleTag } from '../../lib/utils';
+import { getRenderData, varNamePrimaryColor } from '../data';
+import template from './index.ejs';
+import style from './index.scss?inline';
+
+export const defaultColor = '#cc0000' // matches :root { --color-primary } in index.scss
+
+// Get system color scheme
+function getSystemColorMode() {
+ const isDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+ console.log('System color mode:', isDark ? 'dark' : 'light');
+ return isDark ? 'dark' : 'light';
+}
+
+// Make toggleTheme available globally
+window.toggleTheme = function() {
+ const cvContainer = document.querySelector('.cv-container');
+ const themeToggle = document.querySelector('.theme-toggle');
+ if (!cvContainer || !themeToggle) {
+ console.log('Toggle failed: Elements not found', { cvContainer, themeToggle });
+ return;
+ }
+
+ const currentMode = cvContainer.getAttribute('data-color-mode') || getSystemColorMode();
+ console.log('Current color mode before toggle:', currentMode);
+ console.log('Current attributes:', {
+ container: cvContainer.getAttribute('data-color-mode'),
+ toggle: themeToggle.getAttribute('data-mode')
+ });
+
+ const newMode = currentMode === 'light' ? 'dark' : 'light';
+ console.log('New color mode:', newMode);
+
+ cvContainer.setAttribute('data-color-mode', newMode);
+ themeToggle.setAttribute('data-mode', newMode);
+ localStorage.setItem('colorMode', newMode);
+
+ console.log('After toggle attributes:', {
+ container: cvContainer.getAttribute('data-color-mode'),
+ toggle: themeToggle.getAttribute('data-mode'),
+ stored: localStorage.getItem('colorMode')
+ });
+}
+
+export function renderTheme(el, data, primaryColor) {
+ console.log('Rendering theme...');
+ el.innerHTML = ejs.render(template, getRenderData(data));
+ upsertStyleTag('cv-style', style);
+ document.documentElement.style.setProperty(varNamePrimaryColor, primaryColor);
+
+ // Initialize color mode based on stored preference or system preference
+ const storedMode = localStorage.getItem('colorMode');
+ console.log('Stored color mode:', storedMode);
+ const initialMode = storedMode || getSystemColorMode();
+ console.log('Initial color mode:', initialMode);
+
+ const cvContainer = document.querySelector('.cv-container');
+ const themeToggle = document.querySelector('.theme-toggle');
+ if (cvContainer && themeToggle) {
+ console.log('Setting initial color mode...');
+ cvContainer.setAttribute('data-color-mode', initialMode);
+ themeToggle.setAttribute('data-mode', initialMode);
+ console.log('Initial attributes set:', {
+ container: cvContainer.getAttribute('data-color-mode'),
+ toggle: themeToggle.getAttribute('data-mode')
+ });
+ } else {
+ console.log('Elements not found during initialization:', { cvContainer, themeToggle });
+ }
+
+ // Listen for system theme changes
+ window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {
+ if (!localStorage.getItem('colorMode')) {
+ const newMode = e.matches ? 'dark' : 'light';
+ console.log('System color mode changed:', newMode);
+ cvContainer.setAttribute('data-color-mode', newMode);
+ themeToggle.setAttribute('data-mode', newMode);
+ }
+ });
+}
\ No newline at end of file
diff --git a/src/themes/cuiv/index.scss b/src/themes/cuiv/index.scss
new file mode 100644
index 0000000..5c71557
--- /dev/null
+++ b/src/themes/cuiv/index.scss
@@ -0,0 +1,721 @@
+/* Naming convention: https://ricostacruz.com/rscss/ */
+
+// Colors
+$color-black: #000;
+$color-text-dim: #777;
+$color-text-dimmer: #999;
+$color-border-dim: #aaa;
+$color-border-dimmer: #ccc;
+
+// Font sizes
+$fz-1: 32px;
+$fz-2: 20px;
+$fz-3: 16px;
+$fz-4: 14px;
+$fz-5: 13px;
+$fz-6: 12px;
+$lh-p: 1.3;
+
+// Layout system
+:root {
+ // Theme colors
+ --bg-color: #fff;
+ --text-color: #{$color-black};
+ --text-dim: #{$color-text-dim};
+ --text-dimmer: #{$color-text-dimmer};
+ --border-dim: #{$color-border-dim};
+ --border-dimmer: #{$color-border-dimmer};
+ --keyword-bg: #f1f1f1;
+
+ // Default color that can be overridden by meta.colorPrimary
+ --color-primary: #aaa;
+
+ // Time display properties
+ --time-color: var(--text-color);
+ --time-font-style: italic;
+ --time-min-width: 7em;
+ --time-text-align: right;
+ --time-content-ratio: 75%;
+
+ // Spacing system
+ --content-indent: 10em; // Left indentation for content
+ --content-padding: 1em; // Right padding for content
+ --section-gap-large: 1.2em; // Large gaps between sections
+ --section-gap-medium: 1em; // Medium gaps for major subsections
+ --section-gap: 0.8em; // Normal gaps between sections
+ --section-gap-small: 0.4em; // Small gaps between items
+ --section-gap-tiny: 0.2em; // Tiny gaps for tight spacing
+
+ // Print settings
+ --print-margin-top: 0.5in; // Standard Letter margins
+ --print-margin-bottom: 0.5in;
+ --print-margin-left: 0.5in;
+ --print-margin-right: 0.5in;
+}
+
+// Dark mode
+:root[data-theme="dark"] {
+ --bg-color: #1a1a1a;
+}
+
+body {
+ margin: 0;
+ padding: 1rem;
+ min-height: 100vh;
+}
+
+.theme-toggle {
+ position: absolute;
+ top: 1rem;
+ right: 1rem;
+ background: #fff;
+ border: 1px solid var(--border-dimmer);
+ border-radius: 20px;
+ padding: 0.5rem;
+ cursor: pointer;
+ z-index: 1000;
+ box-shadow: 0 2px 5px rgba(0,0,0,0.1);
+
+ @media print {
+ display: none;
+ }
+
+ .theme-icon {
+ display: none;
+ font-size: 1.2rem;
+ line-height: 1;
+
+ &.light {
+ display: inline; // Show sun icon by default
+ }
+ }
+
+ // Override default when dark mode is explicitly set
+ &[data-mode="dark"] {
+ .theme-icon.light { display: none; }
+ .theme-icon.dark { display: inline; }
+ }
+}
+
+.cv-container {
+ background: #fff;
+ color: var(--text-color);
+ font-size: 14px;
+ font-family: system-ui, sans-serif;
+ max-width: 8.5in; // Letter width
+ margin: 0 auto; // Center on screen
+ padding: 2rem;
+ box-shadow: 0 2px 8px rgba(0,0,0,0.1);
+ transition: background-color 0.3s, color 0.3s;
+
+ &[data-color-mode="dark"] {
+ background: #1a1a1a;
+ color: #fff;
+ --text-color: #fff;
+ --text-dim: #aaa;
+ --text-dimmer: #888;
+ --border-dim: #666;
+ --border-dimmer: #444;
+ --keyword-bg: #2a2a2a;
+ }
+
+ @media print {
+ width: 100%;
+ max-width: none;
+ margin: 0;
+ padding: 0;
+ box-shadow: none;
+ background: #fff !important;
+ color: #{$color-black} !important;
+ --text-color: #{$color-black} !important;
+ --text-dim: #{$color-text-dim} !important;
+ --text-dimmer: #{$color-text-dimmer} !important;
+ --border-dim: #{$color-border-dim} !important;
+ --border-dimmer: #{$color-border-dimmer} !important;
+
+ // Only protect header and footer from breaking
+ .basics-section {
+ break-inside: avoid;
+ page-break-inside: avoid;
+ }
+ }
+}
+
+.date-range {
+ font-style: italic;
+}
+
+a {
+ color: var(--text-dim);
+ text-decoration: none;
+}
+
+a:hover {
+ text-decoration: underline;
+}
+
+section {
+ .section-title {
+ margin-top: var(--section-gap-large);
+ margin-bottom: var(--section-gap);
+ display: flex;
+
+ h2 {
+ font-size: $fz-2;
+ font-weight: 600;
+ color: var(--color-primary);
+ margin: 0;
+ }
+ .line {
+ flex-grow: 1;
+ margin: 12px 0 0 1em;
+ height: 2px;
+ background-color: var(--color-primary);
+ }
+ }
+
+ .section-item {
+ margin-top: var(--section-gap-small);
+ margin-left: var(--content-indent);
+ padding-right: var(--content-padding);
+
+ h3 {
+ font-size: $fz-3;
+ line-height: 1.2;
+ margin: 0;
+ }
+
+ h4 {
+ font-size: $fz-4;
+ line-height: 1.2;
+ margin: 0;
+ }
+
+ ul {
+ margin: .3em 0;
+ padding-left: 1.5em;
+ li {
+ margin-bottom: .15em;
+ }
+ }
+ }
+
+ svg {
+ vertical-align: bottom;
+ position: relative;
+ bottom: 1px;
+ }
+ .row {
+ margin: .15em 0;
+ }
+ .p, p {
+ line-height: $lh-p;
+ margin: .3em 0;
+ }
+ .subtitle {
+ font-size: $fz-4;
+ // font-weight: 300;
+
+ @media screen and (max-width: 500px) {
+ display: flex;
+ align-items: center;
+ }
+ }
+
+ .space-between {
+ display: flex;
+ justify-content: space-between;
+
+ a {
+ color: var(--text-dim);
+ }
+ }
+
+ .keywords {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 6px 8px;
+ margin-top: .8em;
+
+ .item {
+ font-size: $fz-5;
+ color: var(--text-color);
+ padding: 2px 8px;
+ background: var(--keyword-bg);
+ border-radius: 4px;
+ }
+ }
+
+ .two-columns {
+ display: grid;
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+ gap: 0 1.5em;
+
+ @media screen and (max-width: 500px) {
+ grid-template-columns: 1fr;
+ }
+ }
+
+ /* helpers */
+ ._fz-4 {
+ font-size: $fz-4;
+ }
+ ._ul {
+ text-decoration: underline;
+ }
+ ._text-dim {
+ color: var(--text-dim);
+ }
+}
+
+@media print {
+ section {
+ .section-title {
+ margin-top: var(--section-gap);
+ margin-bottom: var(--section-gap-small);
+ }
+ .section-item {
+ margin-top: var(--section-gap-small);
+ margin-left: var(--content-indent);
+ padding-right: var(--content-padding);
+ }
+ }
+}
+
+.basics-section {
+ h1 {
+ font-size: $fz-1;
+ font-weight: 600;
+ margin: .1em 0;
+ }
+ .subtitle {
+ font-size: $fz-2;
+ }
+ .contact {
+ color: var(--text-dim);
+ display: flex;
+ flex-wrap: wrap;
+ gap: .4em 1em;
+
+ @media screen and (max-width: 500px) {
+ flex-direction: column;
+ }
+
+ .item {
+ a {
+ color: var(--color-primary);
+ &.colored-link {
+ color: var(--color-primary);
+ text-decoration: none;
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+ }
+ }
+ }
+ .colored-links {
+ color: var(--color-primary);
+ display: flex;
+ flex-wrap: nowrap;
+ gap: 1em;
+
+ .item {
+ white-space: nowrap;
+ }
+
+ a {
+ color: inherit;
+ text-decoration: none;
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+ }
+}
+
+// Shared styles for sections with smaller text
+%academic-section {
+ font-size: $fz-5;
+
+ .section-item {
+ line-height: 1.4;
+
+ h3 {
+ font-size: $fz-4;
+ }
+
+ h4 {
+ font-size: $fz-5;
+ }
+
+ .subtitle {
+ font-size: $fz-5;
+ }
+ }
+}
+
+// Shared time display style and layout
+%time-display {
+ color: var(--text-color);
+ font-style: var(--time-font-style);
+ min-width: var(--time-min-width);
+ text-align: var(--time-text-align);
+}
+
+%time-container {
+ display: flex;
+ justify-content: space-between;
+
+ // Content side
+ > *:first-child {
+ max-width: var(--time-content-ratio);
+ }
+
+ // Time side - include all possible time-related classes
+ > .year,
+ > .date-range,
+ > .period,
+ > .terms {
+ @extend %time-display;
+ }
+}
+
+.education-section {
+ @extend %academic-section;
+ .space-between {
+ @extend %time-container;
+ }
+}
+
+.work-section {
+ @extend %academic-section;
+ .space-between {
+ @extend %time-container;
+ }
+}
+
+.projects-section {
+ @extend %academic-section;
+ .space-between {
+ @extend %time-container;
+ }
+}
+
+.sideprojects-section {
+ .description p:last-of-type {
+ margin-bottom: 0;
+ }
+}
+
+.research-metrics-section {
+ .metrics {
+ display: flex;
+ gap: 2em;
+ font-size: $fz-4;
+
+ .item {
+ color: var(--text-dim);
+ }
+ }
+}
+
+.academic-appointments-section {
+ .appointment {
+ .department {
+ color: var(--text-dim);
+ }
+ .institution {
+ font-style: italic;
+ }
+ }
+}
+
+.teaching-section {
+ .course {
+ .row {
+ @extend %time-container;
+ }
+ .course-info {
+ display: flex;
+ gap: 1em;
+ }
+ .code {
+ font-weight: 600;
+ }
+ .terms {
+ @extend %time-display;
+ }
+ }
+}
+
+.grants-section {
+ .grant {
+ .amount {
+ font-weight: 600;
+ color: var(--color-primary);
+ }
+ .agency {
+ font-style: italic;
+ color: var(--text-dim);
+ }
+ }
+}
+
+.mentoring-section {
+ @extend %academic-section;
+
+ h3 {
+ margin-top: var(--section-gap-medium);
+ margin-bottom: var(--section-gap-small);
+ color: var(--color-primary);
+ font-size: $fz-4;
+ }
+
+ h4 {
+ margin-top: 0.3em;
+ margin-bottom: 0.2em;
+ color: var(--text-dim);
+ font-size: $fz-5;
+ }
+
+ .student {
+ margin-top: 0.2em;
+
+ .row {
+ @extend %time-container;
+ }
+
+ .name {
+ font-weight: 600;
+ }
+
+ .details {
+ margin-top: 0.1em;
+ }
+
+ .program, .period {
+ color: var(--text-dim);
+ }
+
+ .dissertation, .thesis {
+ margin-top: 0.1em;
+ }
+ }
+}
+
+.editorial-positions-section {
+ .position {
+ .role {
+ font-weight: 600;
+ }
+ .journal {
+ font-style: italic;
+ color: var(--text-dim);
+ }
+ }
+}
+
+.professional-services-section {
+ @extend %academic-section;
+
+ h3 {
+ margin-top: var(--section-gap-medium);
+ margin-bottom: var(--section-gap-small);
+ color: var(--color-primary);
+ font-size: $fz-4;
+ }
+
+ // Editorial Boards
+ .service {
+ margin-top: var(--section-gap-tiny);
+
+ .space-between {
+ @extend %time-container;
+ }
+
+ .role {
+ font-weight: 600;
+ }
+
+ .journal, .organization, .committee {
+ font-style: italic;
+ color: var(--text-dim);
+ }
+
+ .details {
+ margin: var(--section-gap-tiny) 0;
+ font-size: $fz-5;
+ }
+ }
+}
+
+.presentations-section {
+ @extend %academic-section;
+
+ h3 {
+ margin-top: var(--section-gap-medium);
+ margin-bottom: var(--section-gap-small);
+ color: var(--color-primary);
+ font-size: $fz-4;
+ }
+
+ .talk, .presentation, .outreach {
+ margin-top: var(--section-gap-tiny);
+
+ .space-between {
+ @extend %time-container;
+ }
+
+ .venue {
+ margin-top: var(--section-gap-tiny);
+ font-size: $fz-5;
+ }
+
+ .description {
+ margin: var(--section-gap-tiny) 0;
+ font-size: $fz-5;
+ }
+ }
+}
+
+.awards-section {
+ @extend %academic-section;
+ .space-between {
+ @extend %time-container;
+ }
+}
+
+.certificates-section {
+ @extend %academic-section;
+ .space-between {
+ @extend %time-container;
+ }
+}
+
+.publications-section {
+ @extend %academic-section;
+
+ .subsection {
+ margin-bottom: var(--section-gap-medium);
+
+ h3 {
+ color: var(--color-primary);
+ margin-bottom: var(--section-gap-small);
+ font-size: $fz-3;
+ }
+ }
+
+ .publication {
+ margin-bottom: var(--section-gap-small);
+
+ .citation {
+ line-height: $lh-p;
+
+ strong { // For CV owner highlighting
+ color: var(--color-primary);
+ }
+
+ em { // For mentee highlighting
+ font-style: italic;
+ color: var(--text-dim);
+ }
+
+ // Make citation number and content appear inline
+ .csl-bib-body {
+ display: flex;
+ align-items: flex-start;
+ }
+
+ .csl-entry {
+ display: flex;
+ align-items: flex-start;
+ flex: 1;
+
+ .csl-left-margin {
+ min-width: 2.5em;
+ padding-right: 0.5em;
+ }
+
+ .csl-right-inline {
+ flex: 1;
+ }
+ }
+ }
+
+ .url {
+ margin-top: var(--section-gap-tiny);
+ font-size: $fz-5;
+ margin-left: 3em; // Match citation content alignment (2.5em + 0.5em padding)
+ }
+
+ .summary {
+ margin-top: var(--section-gap-tiny);
+ color: var(--text-dim);
+ font-size: $fz-5;
+ }
+ }
+
+ .url a {
+ color: var(--text-dim);
+ &:hover {
+ color: var(--text-dim);
+ }
+ }
+}
+
+.research-areas-section {
+ @extend %academic-section;
+
+ .section-item {
+ h3 {
+ font-size: $fz-4;
+ margin-bottom: 0.2em;
+ }
+
+ .description {
+ font-size: $fz-5;
+ line-height: 1.3;
+ }
+
+ .keywords {
+ margin-top: 0.4em;
+ }
+ }
+}
+
+// Update all other hardcoded color references
+.research-metrics-section .metrics .item,
+.academic-appointments-section .department,
+.teaching-section .terms,
+.grants-section .agency,
+.mentoring-section h4,
+.mentoring-section .program,
+.mentoring-section .period,
+.editorial-positions-section .journal,
+.professional-services-section .journal,
+.professional-services-section .organization,
+.professional-services-section .committee,
+.publications-section .citation em,
+.publications-section .summary,
+.publications-section .url a {
+ color: var(--text-dim);
+}
+
+footer {
+ margin-top: var(--section-gap-large);
+ padding-top: var(--section-gap);
+ border-top: 1px solid var(--border-dimmer);
+ color: var(--text-dimmer);
+ font-size: $fz-5;
+
+ display: flex;
+ gap: 1em;
+}
+
+// Dark mode override
+.cv-container[data-color-mode="dark"] {
+ .keywords .item {
+ background: #2a2a2a;
+ }
+}
diff --git a/src/themes/index.js b/src/themes/index.js
index 3bb80c8..d927617 100644
--- a/src/themes/index.js
+++ b/src/themes/index.js
@@ -6,45 +6,32 @@ import {
varNamePrimaryColor,
} from './data';
-const themes = {}
+import { renderTheme as renderReorxTheme, defaultColor as reorxColor } from './reorx/index.js'
+import { renderTheme as renderCuivTheme, defaultColor as cuivColor } from './cuiv/index.js'
-const themeNames = ['reorx']
-
-// https://vitejs.dev/guide/features.html#disabling-css-injection-into-the-page
-// note that `?raw` (https://vitejs.dev/guide/assets.html#importing-asset-as-string)
-// cannot be used because we need vite to transform scss into css
-const styleMoudules = import.meta.glob("./*/index.scss", { "query": "?inline" })
-
-for (const name of themeNames) {
- const templateModule = await import(`./${name}/index.ejs`)
-
- // https://vitejs.dev/guide/features.html#glob-import
- const styleModule = await styleMoudules[`./${name}/index.scss`]()
-
- themes[name] = {
- template: templateModule.default,
- style: styleModule.default,
- }
+const themes = {
+ reorx: renderReorxTheme,
+ cuiv: renderCuivTheme,
}
-// set default
-themes.default = themes.reorx
-
-export function getTheme(name) {
- return themes[name]
+const themeColors = {
+ reorx: reorxColor,
+ cuiv: cuivColor,
}
-export function renderTheme(template, cvData, options) {
- return ejs.render(template, getRenderData(cvData), options)
+export function getAvailableThemes() {
+ return Object.keys(themes)
}
-const cvStyleId = 'cv-style'
-
-export function renderThemeOn(name, el, data, primaryColor) {
- const theme = getTheme(name)
- el.innerHTML = renderTheme(theme.template, data)
-
- upsertStyleTag(cvStyleId, theme.style)
+export function getThemeDefaultColor(themeName) {
+ return themeColors[themeName]
+}
- document.documentElement.style.setProperty(varNamePrimaryColor, primaryColor)
+export function renderThemeOn(themeName, el, data, primaryColor) {
+ const renderFn = themes[themeName]
+ if (!renderFn) {
+ console.error(`Theme ${themeName} not found`)
+ return
+ }
+ renderFn(el, data, primaryColor)
}
diff --git a/src/themes/reorx/index.ejs b/src/themes/reorx/index.ejs
index 2a30151..7490f8e 100644
--- a/src/themes/reorx/index.ejs
+++ b/src/themes/reorx/index.ejs
@@ -372,25 +372,32 @@ function date(item, level) {
-<% if (hasItems(cv.publications)) { %>
-
-
- <% for (const item of cv.publications) { %>
-
-
-
<%= item.name %>
- <%- date(item, 2) %>
+<% if (cv.publications?.length) { %>
+
+ Publications
+ <% cv.publications.forEach(function(pub) { %>
+ <% console.log('[Debug] Template rendering publication:', pub) %>
+
+
<%= pub.name %>
+ <% if (pub.authors?.length) { %>
+ <% console.log('[Debug] Template rendering authors:', pub.authors) %>
+
+ <%= pub.authors.join('; ') %>
+
+ <% } %>
+
+ <% if (pub.venue || pub.releaseDate) { %>
+ <%= pub.venue %><%= pub.releaseDate ? (pub.venue ? ', ' : '') + fn.reformatDate(pub.releaseDate, 'YYYY') : '' %>
+ <% } %>
-
<%= item.publisher %>
- <%- linkInDiv(item.url) %>
- <% if (item.summary) { %>
-
<%- fn.renderMarkdown(item.summary) %>
+ <% if (pub.summary) { %>
+
<%- fn.renderMarkdown(pub.summary) %>
+ <% } %>
+ <% if (pub.url) { %>
+
<% } %>
<% } %>
diff --git a/src/themes/reorx/index.js b/src/themes/reorx/index.js
new file mode 100644
index 0000000..a6c8cb6
--- /dev/null
+++ b/src/themes/reorx/index.js
@@ -0,0 +1,13 @@
+import ejs from 'ejs';
+import { upsertStyleTag } from '../../lib/utils';
+import { getRenderData, varNamePrimaryColor } from '../data';
+import template from './index.ejs';
+import style from './index.scss?inline';
+
+export const defaultColor = '#aaaaaa' // matches :root { --color-primary } in index.scss
+
+export function renderTheme(el, data, primaryColor) {
+ el.innerHTML = ejs.render(template, getRenderData(data))
+ upsertStyleTag('cv-style', style)
+ document.documentElement.style.setProperty(varNamePrimaryColor, primaryColor)
+}
\ No newline at end of file
diff --git a/src/themes/reorx/index.scss b/src/themes/reorx/index.scss
index 88212d1..7705f81 100644
--- a/src/themes/reorx/index.scss
+++ b/src/themes/reorx/index.scss
@@ -224,3 +224,45 @@ section {
margin-bottom: 0;
}
}
+
+.publications {
+ .item {
+ margin-bottom: 1.5em;
+
+ .title {
+ font-weight: bold;
+ margin-bottom: 0.3em;
+ }
+
+ .authors {
+ color: var(--color-primary);
+ margin-bottom: 0.3em;
+ }
+
+ .publisher {
+ font-style: italic;
+ margin-bottom: 0.2em;
+ }
+
+ .date {
+ color: #666;
+ font-size: 0.9em;
+ margin-bottom: 0.2em;
+ }
+
+ .summary {
+ margin: 0.5em 0;
+ }
+
+ .url {
+ font-size: 0.9em;
+ a {
+ color: var(--color-primary);
+ text-decoration: none;
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+ }
+ }
+}
diff --git a/vite.config.js b/vite.config.js
index d83935c..17a34e9 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -18,7 +18,6 @@ renderData.meta = {
description: data.basics.summary.replace('\n', ' '),
}
-
export default defineConfig({
build: {
outDir: outDir,
diff --git a/vite.config.site.js b/vite.config.site.js
index 2d5f344..28f6a5e 100644
--- a/vite.config.site.js
+++ b/vite.config.site.js
@@ -28,6 +28,14 @@ const renderData = {
export default defineConfig({
root: 'src',
+ optimizeDeps: {
+ include: [
+ '@json-editor/json-editor/dist/jsoneditor',
+ 'cash-dom',
+ 'object-path',
+ 'iconify-icon'
+ ]
+ },
build: {
// allows 'import.meta.glob' to work
target: 'esnext',