diff --git a/apps/react-app/public/assets/arrow_select.svg b/apps/react-app/public/assets/arrow_select.svg new file mode 100644 index 00000000..e95f9707 --- /dev/null +++ b/apps/react-app/public/assets/arrow_select.svg @@ -0,0 +1,6 @@ + + + diff --git a/apps/react-app/public/assets/miguel-galvez.jpg b/apps/react-app/public/assets/miguel-galvez.jpg new file mode 100644 index 00000000..8799ebeb Binary files /dev/null and b/apps/react-app/public/assets/miguel-galvez.jpg differ diff --git a/apps/react-app/src/common-app/components/codemirror/codemirror.component.tsx b/apps/react-app/src/common-app/components/codemirror/codemirror.component.tsx index f2f8e89b..7faa6620 100644 --- a/apps/react-app/src/common-app/components/codemirror/codemirror.component.tsx +++ b/apps/react-app/src/common-app/components/codemirror/codemirror.component.tsx @@ -1,10 +1,8 @@ import React from 'react'; - +import { basicSetup } from 'codemirror'; import { EditorState } from '@codemirror/state'; import { json } from '@codemirror/lang-json'; -import { basicSetup } from 'codemirror'; import { EditorView, ViewUpdate, placeholder } from '@codemirror/view'; - import { codeMirrorTheme } from './codemirror.styles'; interface Props { diff --git a/apps/react-app/src/common-app/components/codemirror/codemirror.styles.ts b/apps/react-app/src/common-app/components/codemirror/codemirror.styles.ts index 90536ba0..3eb7bf5a 100644 --- a/apps/react-app/src/common-app/components/codemirror/codemirror.styles.ts +++ b/apps/react-app/src/common-app/components/codemirror/codemirror.styles.ts @@ -13,6 +13,9 @@ export const codeMirrorTheme = EditorView.theme({ }, '.cm-scroller': { overflow: 'auto' }, '.cm-gutterElement': { display: 'none' }, + '.cm-content': { + fontFamily: 'Inter, sans-serif', + }, '.cm content, .cm-gutters,': { minHeight: '100%', backgroundColor: '#152128', diff --git a/apps/react-app/src/common-app/components/export-config/export-config.component.tsx b/apps/react-app/src/common-app/components/export-config/export-config.component.tsx deleted file mode 100644 index 6767b264..00000000 --- a/apps/react-app/src/common-app/components/export-config/export-config.component.tsx +++ /dev/null @@ -1,126 +0,0 @@ -import React from 'react'; -import { ExportHTMLSettings } from '@lemoncode/manfred2html'; -import { theme } from '@/core/theme'; -import { Button } from '@/common-app/components'; -import * as classes from './export-config.styles'; -import { useUserChoiceContext } from '@/core/user-choice'; -interface Props { - htmlTemplate: string; - cancelExport: () => void; - onExportToHTML: (exportHTMLSettings: ExportHTMLSettings) => void; - onHTMLSettingSelectionChanged: (text: string, exportHTMLSettings: ExportHTMLSettings) => string; -} - -const DOWNLOAD_MESSAGE_TIMEOUT = 2500; - -export const ExportConfig: React.FC = props => { - const { onExportToHTML, cancelExport, htmlTemplate, onHTMLSettingSelectionChanged } = props; - const { userChoice } = useUserChoiceContext(); - const [exportHTMLSettings, setExportHTMLSettings] = React.useState({ - primaryColor: theme.palette.primary[600], - }); - const [isDownloadInProgress, setIsDownloadInProgress] = React.useState(false); - - const [htmlPreview, setHtmlPreview] = React.useState( - onHTMLSettingSelectionChanged(htmlTemplate, exportHTMLSettings) - ); - - const handleColorChange = (event: React.ChangeEvent) => { - setExportHTMLSettings({ primaryColor: event.target.value }); - onHTMLSettingSelectionChanged(htmlTemplate, { primaryColor: event.target.value }); - }; - const handleExportConfigSelection = () => { - setIsDownloadInProgress(true); - onExportToHTML(exportHTMLSettings); - - setTimeout(() => { - cancelExport(); - }, DOWNLOAD_MESSAGE_TIMEOUT); - }; - - React.useEffect(() => { - setHtmlPreview(onHTMLSettingSelectionChanged(htmlTemplate, exportHTMLSettings)); - }, [exportHTMLSettings]); - - return ( -
-
-

SELECCIONA TU TEMA FAVORITO

-
- - - - - - -
-

Ejemplo de previsualización

- -
- - -
- {isDownloadInProgress && ( -
Descarga completada. Revisa tu carpeta de descargas
- )} -
-
- ); -}; diff --git a/apps/react-app/src/common-app/components/index.ts b/apps/react-app/src/common-app/components/index.ts index 00e6f514..df50ccb6 100644 --- a/apps/react-app/src/common-app/components/index.ts +++ b/apps/react-app/src/common-app/components/index.ts @@ -4,6 +4,6 @@ export * from './button'; export * from './navbar'; export * from './card'; export * from './modal'; -export * from './export-config'; +export * from './select'; export * from './alert-message'; export * from './codemirror'; diff --git a/apps/react-app/src/common-app/components/modal/index.ts b/apps/react-app/src/common-app/components/modal/index.ts index 4434fee2..0c42f837 100644 --- a/apps/react-app/src/common-app/components/modal/index.ts +++ b/apps/react-app/src/common-app/components/modal/index.ts @@ -1 +1 @@ -export * from './modal.component' +export * from './modal.component'; diff --git a/apps/react-app/src/common-app/components/modal/modal.component.tsx b/apps/react-app/src/common-app/components/modal/modal.component.tsx index d8fdc534..f2c6aae1 100644 --- a/apps/react-app/src/common-app/components/modal/modal.component.tsx +++ b/apps/react-app/src/common-app/components/modal/modal.component.tsx @@ -6,8 +6,8 @@ interface Props { isOpen: boolean; } -export const Modal: React.FC = (props) => { +export const Modal: React.FC = props => { const { children, isOpen } = props; - - return isOpen &&
{children}
+ + return isOpen &&
{children}
; }; diff --git a/apps/react-app/src/common-app/components/modal/modal.styles.ts b/apps/react-app/src/common-app/components/modal/modal.styles.ts index 1070dbcc..f2a6e94b 100644 --- a/apps/react-app/src/common-app/components/modal/modal.styles.ts +++ b/apps/react-app/src/common-app/components/modal/modal.styles.ts @@ -1,6 +1,17 @@ -import { css } from '@emotion/css'; +import { css, keyframes } from '@emotion/css'; import { theme } from '@/core/theme'; +const openFromCenter = keyframes` + from { + transform: scale(0); + opacity: 0; + } + to { + transform: scale(1); + opacity: 1; + } +`; + export const container = css` display: flex; width: 100%; @@ -8,13 +19,21 @@ export const container = css` flex-direction: column; justify-content: center; align-items: center; - gap: 40px; + gap: ${theme.spacing(10)}; position: absolute; z-index: 9999; top: 0; background: rgba(13, 20, 24, 0.75); - overflow: hidden; + transform: scale(0); + opacity: 0; + animation: ${openFromCenter} 0.2s ease forwards; + & > :first-child { + max-width: 1400px; + align-self: center; + overflow: hidden; + overflow-y: scroll; + } @media (min-width: 725px) { padding: ${theme.spacing(4)}; } diff --git a/apps/react-app/src/common-app/components/select/customSelect.component.tsx b/apps/react-app/src/common-app/components/select/customSelect.component.tsx new file mode 100644 index 00000000..6f6c184b --- /dev/null +++ b/apps/react-app/src/common-app/components/select/customSelect.component.tsx @@ -0,0 +1,52 @@ +import React from 'react'; +import { cx } from '@emotion/css'; +import * as classes from './customSelect.styles'; + +interface Props { + listOptions: string[]; + label: string; + onSelectedOption: (option: string) => void; +} +export const CustomSelect: React.FC = props => { + const { listOptions, label, onSelectedOption } = props; + const [isOpen, setIsOpen] = React.useState(false); + const [selectedOption, setSelectedOption] = React.useState(listOptions[0]); + + const toggleIsOpen = () => { + setIsOpen(!isOpen); + }; + + const handleOnMouseLeave = () => isOpen && toggleIsOpen(); + + const handleOptionSelect = (option: string) => { + onSelectedOption(option); + setSelectedOption(option); + setIsOpen(false); + }; + + return ( +
+ {label} +
+ {selectedOption} + arrow select +
+ {isOpen && ( +
    + {listOptions && + listOptions.map((option, index) => ( +
  • handleOptionSelect(option)}> + {option} + {index === 0 && ' (por defecto)'} +
    • + ))} +
+ )} +
+ ); +}; diff --git a/apps/react-app/src/common-app/components/select/customSelect.styles.ts b/apps/react-app/src/common-app/components/select/customSelect.styles.ts new file mode 100644 index 00000000..45dea6c7 --- /dev/null +++ b/apps/react-app/src/common-app/components/select/customSelect.styles.ts @@ -0,0 +1,124 @@ +import { css, keyframes } from '@emotion/css'; +import { theme } from '@/core/theme'; + +export const selectContainer = css` + position: relative; + display: flex; + flex-direction: column; + gap: ${theme.spacing(2)}; + + @media (min-width: 725px) { + flex-grow: 1; + width: 100%; + } +`; + +export const label = css` + flex-grow: 1; + color: ${theme.palette.dark[300]}; + font-family: Inter; + font-size: 12px; + font-style: normal; + font-weight: 400; + line-height: 22px; + letter-spacing: 0.15px; + padding: 0 ${theme.spacing(2)}; + background-color: ${theme.palette.info[50]}; + position: absolute; + top: -${theme.spacing(3)}; + left: ${theme.spacing(3)}; +`; +export const selectContent = css` + cursor: pointer; + display: flex; + padding: ${theme.spacing(3)} ${theme.spacing(4)}; + align-items: flex-start; + gap: ${theme.spacing(2)}; + align-self: stretch; + border: 1px solid ${theme.palette.info[600]}; + border-radius: 8px; + background: ${theme.palette.info[50]}; + + span { + flex-grow: 1; + color: ${theme.palette.dark[900]}; + font-family: Inter; + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 22px; + letter-spacing: 0.15px; + } +`; + +const slideDown = keyframes` + from { + max-height: 0; + opacity: 0; + } + to { + max-height: min-content; + opacity: 1; + } +`; + +const slideUp = keyframes` + from { + max-height: min-content; + opacity: 1; + } + to { + max-height: 0; + opacity: 0; + } +`; + +export const listContainerOpenAnimation = css` + animation: ${slideDown} 0.3s ease forwards; +`; +export const listContainerCloseAnimation = css` + animation: ${slideUp} 0.3s ease forwards; +`; + +export const listContainer = css` + opacity: 0; + max-height: 0; + overflow: hidden; + position: absolute; + top: ${theme.spacing(12)}; + width: 100%; + display: flex; + flex-direction: column; + z-index: 999; + padding: ${theme.spacing(2)} ${theme.spacing(0)}; + gap: ${theme.spacing(2)}; + border-radius: 4px; + background: ${theme.palette.info[50]}; + box-shadow: 0px 2px 6px 2px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.3); + + li { + cursor: pointer; + display: flex; + height: ${theme.spacing(8)}; + padding: ${theme.spacing(0)} ${theme.spacing(4)}; + justify-content: flex-start; + align-items: center; + + color: ${theme.palette.dark[900]}; + font-family: Inter; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 20px; + letter-spacing: 0.25px; + + :hover { + background: ${theme.palette.primary[50]}; + } + } +`; + +export const rotate = (rotate: boolean) => css` + rotate: ${rotate ? '180deg' : '0deg'}; + transition: rotate 0.3s ease; +`; diff --git a/apps/react-app/src/common-app/components/select/index.ts b/apps/react-app/src/common-app/components/select/index.ts new file mode 100644 index 00000000..c77d0ae0 --- /dev/null +++ b/apps/react-app/src/common-app/components/select/index.ts @@ -0,0 +1 @@ +export * from './customSelect.component'; diff --git a/apps/react-app/src/pods/about-us/data-json.ts b/apps/react-app/src/pods/about-us/data-json.ts index f314df11..b5e2eff6 100644 --- a/apps/react-app/src/pods/about-us/data-json.ts +++ b/apps/react-app/src/pods/about-us/data-json.ts @@ -47,4 +47,12 @@ export const userList: User[] = [ description: 'Desarrollador Front End, cursé el bootcamp de JavaScript de Lemoncode y decidí dar un giro a mi carrera profesional para volcarme en la programación. Mi carrera se ha centrado en puestos de gestión, relacionados con mis estudios (Finanzas y Contabilidad, Logística). No obstante, tras cursar el bootcamp de JavaScript de Lemoncode, decidí dar un giro a mi carrera profesional y volcarme en el mundo de la programación. Actualmente, estoy cursando el Máster Front End de Lemoncode, donde sigo ampliando mis habilidades en el desarrollo web.', }, + { + avatar: './assets/miguel-galvez.jpg', + name: 'Miguel Gálvez', + job: 'Frontend Developer', + linkedin_url: 'https://es.linkedin.com/in/miguelgalvezk', + description: + 'Graduado en Derecho y Ciencias Políticas. Con anterioridad a dedicarme al desarrollo web, ejercí en un despacho la abogacía penal. Cursé el Bootcamp de JavaScript de Lemoncode y su Máster de FrontEnd. Quedé entusiasmado con la combinación de análisis y creatividad, versatilidad y belleza de la programación. Actualmente estoy estudiando DAW y formándome ante cualquier oportunidad que encuentre en este apasionante sector.', + }, ]; diff --git a/apps/react-app/src/pods/template-export/components/customSelectColor/components/index.ts b/apps/react-app/src/pods/template-export/components/customSelectColor/components/index.ts new file mode 100644 index 00000000..a3d6fe86 --- /dev/null +++ b/apps/react-app/src/pods/template-export/components/customSelectColor/components/index.ts @@ -0,0 +1 @@ +export * from './inputRadioButton.component'; diff --git a/apps/react-app/src/pods/template-export/components/customSelectColor/components/inputRadioButton.component.tsx b/apps/react-app/src/pods/template-export/components/customSelectColor/components/inputRadioButton.component.tsx new file mode 100644 index 00000000..a540096f --- /dev/null +++ b/apps/react-app/src/pods/template-export/components/customSelectColor/components/inputRadioButton.component.tsx @@ -0,0 +1,22 @@ +import { HexColor, ColorTheme } from '@lemoncode/manfred2html'; +import * as classes from './inputRadioButton.styles'; + +interface Props { + value: ColorTheme; + hexColor: HexColor; + onChange: (event: React.ChangeEvent) => void; +} + +export const InputRadioButton: React.FC = ({ value, hexColor, onChange }) => { + return ( + + ); +}; diff --git a/apps/react-app/src/pods/template-export/components/customSelectColor/components/inputRadioButton.styles.ts b/apps/react-app/src/pods/template-export/components/customSelectColor/components/inputRadioButton.styles.ts new file mode 100644 index 00000000..28cd916a --- /dev/null +++ b/apps/react-app/src/pods/template-export/components/customSelectColor/components/inputRadioButton.styles.ts @@ -0,0 +1,18 @@ +import { css } from '@emotion/css'; +import { theme } from '@/core/theme'; + +export const inputRadioButton = (color: string) => css` + appearance: none; + width: 82px; + height: 82px; + box-shadow: 8px 8px 16px 0px rgba(0, 0, 0, 0.25); + border-radius: 50%; + background-color: ${color}; + cursor: pointer; + outline: none; + border: 15px solid ${theme.palette.info[50]}; + + &[type='radio']:checked { + box-shadow: 0px 0px 0px 4px ${theme.palette.dark[200]}; + } +`; diff --git a/apps/react-app/src/pods/template-export/components/customSelectColor/customSelectColor.component.tsx b/apps/react-app/src/pods/template-export/components/customSelectColor/customSelectColor.component.tsx new file mode 100644 index 00000000..2290a79e --- /dev/null +++ b/apps/react-app/src/pods/template-export/components/customSelectColor/customSelectColor.component.tsx @@ -0,0 +1,52 @@ +import React from 'react'; +import { cx } from '@emotion/css'; +import { ColorTheme, HexColor } from '@lemoncode/manfred2html'; +import { InputRadioButton } from './components'; +import * as classes from './customSelectColor.styles'; + +interface Props { + label: string; + onChange: (event: React.ChangeEvent) => void; +} +type CustomSelectState = 'noInit' | 'open' | 'close'; + +export const CustomSelectColor: React.FC = ({ label, onChange }) => { + const [customSelectState, setCustomSelectState] = React.useState('noInit'); + + const toggleIsOpen = () => { + setCustomSelectState(customSelectState === 'open' ? 'close' : 'open'); + }; + + React.useEffect(() => { + if (window.innerWidth >= 1024) { + setCustomSelectState('open'); + } + }, []); + return ( +
+
+ {label} + arrow select +
+
+ {Object.keys(HexColor).map(colorKey => ( + + ))} +
+
+ ); +}; diff --git a/apps/react-app/src/pods/template-export/components/customSelectColor/customSelectColor.styles.ts b/apps/react-app/src/pods/template-export/components/customSelectColor/customSelectColor.styles.ts new file mode 100644 index 00000000..0612136e --- /dev/null +++ b/apps/react-app/src/pods/template-export/components/customSelectColor/customSelectColor.styles.ts @@ -0,0 +1,64 @@ +import { css, keyframes } from '@emotion/css'; +import { theme } from '@/core/theme'; + +const openAnimation = keyframes` + 0% { + max-height: 48px; + } + + 100% { + max-height: 500px; + } +`; +const closeAnimation = keyframes` + 0% { + max-height: 500px; + } + + 100% { + max-height: 48px; + } +`; + +export const rootOpenAnimation = css` + animation: ${openAnimation} 0.3s ease forwards; +`; +export const rootCloseAnimation = css` + animation: ${closeAnimation} 0.3s ease forwards; +`; + +export const root = css` + border-bottom: 1px solid ${theme.palette.info[600]}; + overflow: hidden; + max-height: 48px; +`; +export const labelContainer = css` + display: flex; + justify-content: space-between; + padding: ${theme.spacing(3)} ${theme.spacing(4)}; + gap: ${theme.spacing(2)}; + border-radius: 8px; + background: ${theme.palette.info[50]}; + cursor: pointer; + span { + color: ${theme.palette.info[900]}; + font-family: Sanchez; + font-size: 18px; + font-style: normal; + font-weight: 400; + line-height: 24px; + } +`; +export const colorFieldset = css` + background: ${theme.palette.info[50]}; + display: flex; + padding: ${theme.spacing(8)} ${theme.spacing(0)}; + flex-wrap: wrap; + justify-content: center; + gap: ${theme.spacing(8)}; +`; + +export const rotate = (customSelectState: boolean) => css` + rotate: ${customSelectState ? '180deg' : '0deg'}; + transition: rotate 0.3s ease; +`; diff --git a/apps/react-app/src/pods/template-export/components/customSelectColor/index.ts b/apps/react-app/src/pods/template-export/components/customSelectColor/index.ts new file mode 100644 index 00000000..5e468c64 --- /dev/null +++ b/apps/react-app/src/pods/template-export/components/customSelectColor/index.ts @@ -0,0 +1 @@ +export * from './customSelectColor.component'; diff --git a/apps/react-app/src/pods/template-export/components/export-config/export-config.component.tsx b/apps/react-app/src/pods/template-export/components/export-config/export-config.component.tsx new file mode 100644 index 00000000..fc144bc0 --- /dev/null +++ b/apps/react-app/src/pods/template-export/components/export-config/export-config.component.tsx @@ -0,0 +1,111 @@ +import React from 'react'; +import { + TemplateCV, + ColorTheme, + Language, + ExportHTMLSettings, + createDefaultExportHTMLSettings, +} from '@lemoncode/manfred2html'; +import { Button, CustomSelect } from '@/common-app/components'; +import { CustomSelectColor } from '../customSelectColor/customSelectColor.component'; +import * as classes from './export-config.styles'; +interface Props { + htmlTemplate: string; + cancelExport: () => void; + onExportToHTML: (exportHTMLSettings: ExportHTMLSettings) => void; + onHTMLSettingSelectionChanged: (text: string, exportHTMLSettings: ExportHTMLSettings) => string; +} + +const DOWNLOAD_MESSAGE_TIMEOUT = 2500; +const DESING_OPTIONS: TemplateCV[] = ['Moderno elegante', 'Limpio y organizado']; +const LANGUAGE_OPTIONS: Language[] = ['es', 'en']; + +export const ExportConfig: React.FC = props => { + const { onExportToHTML, cancelExport, htmlTemplate, onHTMLSettingSelectionChanged } = props; + const [exportHTMLSettings, setExportHTMLSettings] = React.useState( + createDefaultExportHTMLSettings() + ); + const [isDownloadInProgress, setIsDownloadInProgress] = React.useState(false); + + const [htmlPreview, setHtmlPreview] = React.useState( + onHTMLSettingSelectionChanged(htmlTemplate, exportHTMLSettings) + ); + + const handleColorChange = (event: React.ChangeEvent) => { + setExportHTMLSettings({ ...exportHTMLSettings, colorTheme: event.target.value as ColorTheme }); + onHTMLSettingSelectionChanged(htmlTemplate, { + ...exportHTMLSettings, + colorTheme: event.target.value as ColorTheme, + }); + }; + + const handleTemplateChange = (templateCV: string) => { + setExportHTMLSettings({ ...exportHTMLSettings, template: templateCV as TemplateCV }); + onHTMLSettingSelectionChanged(htmlTemplate, { + ...exportHTMLSettings, + template: templateCV as TemplateCV, + }); + }; + + const handleLanguageChange = (language: string) => { + setExportHTMLSettings({ ...exportHTMLSettings, language: language as Language }); + onHTMLSettingSelectionChanged(htmlTemplate, { + ...exportHTMLSettings, + language: language as Language, + }); + }; + const handleExportConfigSelection = () => { + setIsDownloadInProgress(true); + onExportToHTML(exportHTMLSettings); + + setTimeout(() => { + cancelExport(); + }, DOWNLOAD_MESSAGE_TIMEOUT); + }; + + React.useEffect(() => { + setHtmlPreview(onHTMLSettingSelectionChanged(htmlTemplate, exportHTMLSettings)); + }, [exportHTMLSettings]); + + return ( +
+

PERSONALIZA A TU GUSTO

+
+
+
+ + {/* Uncomment when we have all label translations */} + {/* */} +
+
+ +
+
+
+

Previsualización

+ +
+
+
+ + +
+ {isDownloadInProgress && ( +
Descarga completada. Revisa tu carpeta de descargas
+ )} +
+ ); +}; diff --git a/apps/react-app/src/common-app/components/export-config/export-config.styles.ts b/apps/react-app/src/pods/template-export/components/export-config/export-config.styles.ts similarity index 50% rename from apps/react-app/src/common-app/components/export-config/export-config.styles.ts rename to apps/react-app/src/pods/template-export/components/export-config/export-config.styles.ts index 006128ab..4f2e4d3a 100644 --- a/apps/react-app/src/common-app/components/export-config/export-config.styles.ts +++ b/apps/react-app/src/pods/template-export/components/export-config/export-config.styles.ts @@ -3,54 +3,30 @@ import { theme } from '@/core/theme'; export const content = css` display: flex; - padding: ${theme.spacing(8)}; + padding: ${theme.spacing(4)}; flex-direction: column; - align-items: center; - gap: ${theme.spacing(16)}; + align-items: stretch; + gap: ${theme.spacing(10)}; flex-grow: 1; width: 100%; background: ${theme.palette.info[50]}; ${theme.typography.mobile.h5}; + @media (min-width: 725px) { - border-radius: 16px; ${theme.typography.tablet.h5}; + padding: ${theme.spacing(8)}; + gap: ${theme.spacing(12)}; + flex: 1 0 0; + border-radius: 16px; + align-items: stretch; } - @media (min-width: 1024px) { - ${theme.typography.desktop.h5}; - } -`; - -export const optionsContainer = css` - display: flex; - flex-direction: column; - flex-grow: 1; - gap: ${theme.spacing(8)}; - width: 100%; -`; - -export const colorFieldset = css` - display: flex; - flex-wrap: wrap; - justify-content: center; - gap: ${theme.spacing(8)}; - width: 100%; @media (min-width: 1024px) { - justify-content: start; - } -`; -export const inputRadioButton = (color: string) => css` - appearance: none; - width: 82px; - height: 82px; - box-shadow: 8px 8px 16px 0px rgba(0, 0, 0, 0.25); - border-radius: 50%; - background-color: ${color}; - cursor: pointer; - outline: none; - border: 15px solid ${theme.palette.info[50]}; - &[type='radio']:checked { - box-shadow: 0px 0px 0px 4px ${theme.palette.dark[200]}; + ${theme.typography.desktop.h5}; + align-items: flex-center; + gap: ${theme.spacing(8)}; + align-self: stretch; + padding: ${theme.spacing(8)}; } `; @@ -70,14 +46,15 @@ export const iframeCV = css` export const buttonContainer = css` display: flex; - justify-content: center; + flex-direction: column; + justify-content: flex-end; align-items: center; gap: ${theme.spacing(8)}; - padding: ${theme.spacing(4)}; - flex-direction: column; + width: 100%; @media (min-width: 1024px) { flex-direction: row; + justify-content: flex-end; } `; @@ -108,3 +85,75 @@ export const downloadMessage = css` ${theme.typography.desktop.h5}; } `; + +export const optionsContainer = css` + display: flex; + flex-direction: column; + gap: ${theme.spacing(10)}; + flex-grow: 1; + @media (min-width: 725px) { + gap: ${theme.spacing(12)}; + } + @media (min-width: 1024px) { + flex-direction: row; + align-items: flex-start; + align-self: stretch; + height: 512px; + } +`; + +export const optionsContent = css` + display: flex; + flex-direction: column; + gap: ${theme.spacing(10)}; + + @media (min-width: 725px) { + gap: ${theme.spacing(12)}; + } + + @media (min-width: 1024px) { + gap: ${theme.spacing(10)}; + } +`; +export const selectContainer = css` + display: flex; + flex-direction: column; + gap: ${theme.spacing(10)}; + + @media (min-width: 725px) { + gap: ${theme.spacing(4)}; + flex-direction: row; + width: 100%; + } + @media (min-width: 1024px) { + width: 274px; + flex-direction: column; + gap: ${theme.spacing(10)}; + padding-top: ${theme.spacing(4)}; + } +`; +export const selectColorContainer = css` + @media (min-width: 1024px) { + width: 274px; + flex-direction: column; + gap: ${theme.spacing(4)}; + } +`; +export const prevContainer = css` + display: flex; + flex-direction: column; + gap: ${theme.spacing(10)}; + flex-grow: 1; + + @media (min-width: 725px) { + gap: ${theme.spacing(12)}; + } + + @media (min-width: 1024px) { + flex-direction: column; + align-items: flex-start; + flex: 1 0 0; + align-self: stretch; + gap: ${theme.spacing(8)}; + } +`; diff --git a/apps/react-app/src/common-app/components/export-config/index.ts b/apps/react-app/src/pods/template-export/components/export-config/index.ts similarity index 100% rename from apps/react-app/src/common-app/components/export-config/index.ts rename to apps/react-app/src/pods/template-export/components/export-config/index.ts diff --git a/apps/react-app/src/pods/template-export/template-export.component.tsx b/apps/react-app/src/pods/template-export/template-export.component.tsx index ecef284d..13679801 100644 --- a/apps/react-app/src/pods/template-export/template-export.component.tsx +++ b/apps/react-app/src/pods/template-export/template-export.component.tsx @@ -1,16 +1,8 @@ import React from 'react'; import { ExportHTMLSettings } from '@lemoncode/manfred2html'; import { useUserChoiceContext } from '@/core'; -import { - Button, - Footer, - Header, - Modal, - Navbar, - ExportConfig, - AlertMessage, - CodeMirrorComponent, -} from '@/common-app/components'; +import { Button, Footer, Header, Modal, Navbar, AlertMessage, CodeMirrorComponent } from '@/common-app/components'; +import { ExportConfig } from './components/export-config'; import * as classes from './template-export.styles'; interface Props { diff --git a/apps/react-app/src/pods/template-export/template-export.container.tsx b/apps/react-app/src/pods/template-export/template-export.container.tsx index 9fe87295..a6a63c55 100644 --- a/apps/react-app/src/pods/template-export/template-export.container.tsx +++ b/apps/react-app/src/pods/template-export/template-export.container.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { exportManfredJSonToWordAndDownload, parseStringToManfredJSon } from '@lemoncode/manfred2word'; import { exportManfredJSonToMarkdown } from '@lemoncode/manfred2md'; -import { exportManfredJSonToHTML, ExportHTMLSettings } from '@lemoncode/manfred2html'; +import { exportHTMLTemplate, ExportHTMLSettings } from '@lemoncode/manfred2html'; import { DEFAULT_EXPORT_FILENAME } from '@/core'; import { download } from '@/common'; import { TemplateExport } from './template-export.component'; @@ -38,7 +38,7 @@ export const TemplateExportContainer: React.FC = () => { const onExportToHTML = async (text: string, exportHTMLSettings: ExportHTMLSettings) => { try { const manfredJsonContent = parseManfredJson(text); - const content = exportManfredJSonToHTML(manfredJsonContent, exportHTMLSettings); + const content = exportHTMLTemplate(manfredJsonContent, exportHTMLSettings); const blob = new Blob([content], { type: 'text/html' }); await download(blob, 'manfred.html'); @@ -49,7 +49,7 @@ export const TemplateExportContainer: React.FC = () => { const onHTMLSettingChanged = (text: string, exportHTMLSettings: ExportHTMLSettings): string => { const manfredJsonContent = parseManfredJson(text); - const content = exportManfredJSonToHTML(manfredJsonContent, exportHTMLSettings); + const content = exportHTMLTemplate(manfredJsonContent, exportHTMLSettings); return content; }; diff --git a/export-samples/html/cv-template-2.html b/export-samples/html/cv-template-2.html index d6dd1685..049273a5 100644 --- a/export-samples/html/cv-template-2.html +++ b/export-samples/html/cv-template-2.html @@ -299,12 +299,9 @@

Mis enlaces

Linkedin
- - + diff --git a/export-samples/html/cv-template.html b/export-samples/html/cv-template.html index 01c260a1..88fae6ea 100644 --- a/export-samples/html/cv-template.html +++ b/export-samples/html/cv-template.html @@ -285,6 +285,7 @@ display: flex; flex-direction: column; gap: var(--spacing_8); + text-transform: capitalize; } .main__section__item > .date-desktop { display: none; @@ -316,8 +317,11 @@ } .main__section__item > .date-desktop { display: flex; + flex-direction: column; + gap: var(--spacing_8); min-width: max-content; - align-items: flex-end; + text-align: end; + padding-top: var(--spacing_8); } .section__content__header > h3 { font-size: 24px; @@ -413,17 +417,19 @@

mis enlaces

+ Twitter
@@ -594,7 +600,7 @@

Experiencia / carrera

-

Inicio: 2018-06-20

+

Inicio: Dic 2020

Fin: Actualidad

@@ -607,7 +613,7 @@

Manfred

Plataforma de Talento y agencia de recruiting técnico

-

Inicio: 2018-06-20

+

Inicio: Jun 2017

Fin: Actualidad

@@ -644,8 +650,8 @@

Plataforma de Talento y agencia de recruiting técnico

-

Inicio: 2017-02-01

-

Fin: 2018-06-30

+

Inicio: Feb 2017

+

Fin: Jun 2018

@@ -701,8 +707,8 @@

Educación

-

Inicio: 2002-09-15

-

Fin: 2006-06-30

+

Inicio: Sep 2022

+

Fin: Jun 2006

@@ -714,8 +720,8 @@

Ingeniería Técnica Informática

Computer Science Grade

-

Inicio: 2002-09-15

-

Fin: 2006-06-30

+

Inicio: Sep 2002

+

Fin: Jun 2006

Tipo de estudios: Grado oficial

@@ -727,8 +733,8 @@

Computer Science Grade

-

Inicio: 2002-09-15

-

Fin: 2006-06-30

+

Inicio: Ene 2001

+

Fin: Oct 2001

@@ -740,8 +746,8 @@

Master en Desarrollo de Aplicaciones Web

Computer Science Grade

-

Inicio: 2002-09-15

-

Fin: 2006-06-30

+

Inicio: Abr 2002

+

Fin: May 2003

Tipo de estudios: Certificación

@@ -753,8 +759,8 @@

Computer Science Grade

-

Inicio: 2007-05-14

-

Fin: 2007-05-21

+

Inicio: Jun 2007

+

Fin: Jul 2008

@@ -766,8 +772,8 @@

Certified Scrum Master

Scrum Master certificado por la Scrum Alliance

-

Inicio: 2007-05-14

-

Fin: 2007-05-21

+

Inicio: Dic 2007

+

Fin: Mar 2008

Tipo de estudios: Certificación

diff --git a/packages/manfred-common/package.json b/packages/manfred-common/package.json index 01fcb94f..b16ac594 100644 --- a/packages/manfred-common/package.json +++ b/packages/manfred-common/package.json @@ -34,6 +34,11 @@ "import": "./src/doc-parts/studies-section/index.ts", "require": "./src/doc-parts/studies-section/index.ts", "types": "./src/doc-parts/studies-section/index.ts" + }, + "./model": { + "import": "./src/model/index.ts", + "require": "./src/model/index.ts", + "types": "./src/model/index.ts" } }, "scripts": { diff --git a/packages/manfred2html/src/engine/engine.const.ts b/packages/manfred2html/src/engine/engine.const.ts new file mode 100644 index 00000000..ed2668bf --- /dev/null +++ b/packages/manfred2html/src/engine/engine.const.ts @@ -0,0 +1 @@ +export const ISO_SPANISH_LANGUAGE = 'es'; diff --git a/packages/manfred2html/src/engine/html-parts/about-me-section/about-me-section.part.ts b/packages/manfred2html/src/engine/html-parts/about-me-section/about-me-section.part.ts deleted file mode 100644 index d945a21a..00000000 --- a/packages/manfred2html/src/engine/html-parts/about-me-section/about-me-section.part.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { ManfredAwesomicCV } from '@/model'; -import { ProfileSectionVm, mapFromMacCvToProfileSectionVm } from '@lemoncode/manfred-common/profile-section'; -import aboutMe from './about-me-section.ejs?raw'; -import ejs from 'ejs'; - -export const generateAboutMeSection = (cv: ManfredAwesomicCV): string => { - const profileSectionVm = mapFromMacCvToProfileSectionVm(cv); - - return generateAboutMeSectionInner(profileSectionVm); -}; - -const generateAboutMeSectionInner = (profileSectionVm: ProfileSectionVm): string => { - const rootObject = { - profile: profileSectionVm, - }; - - return ejs.render(aboutMe, rootObject); -}; diff --git a/packages/manfred2html/src/engine/html-parts/experience-section/index.ts b/packages/manfred2html/src/engine/html-parts/experience-section/index.ts deleted file mode 100644 index 03b6e599..00000000 --- a/packages/manfred2html/src/engine/html-parts/experience-section/index.ts +++ /dev/null @@ -1 +0,0 @@ -export* from './experience-section.part'; diff --git a/packages/manfred2html/src/engine/html-parts/hard-skills-section/hard-skills-section.part.ts b/packages/manfred2html/src/engine/html-parts/hard-skills-section/hard-skills-section.part.ts deleted file mode 100644 index d5979773..00000000 --- a/packages/manfred2html/src/engine/html-parts/hard-skills-section/hard-skills-section.part.ts +++ /dev/null @@ -1,16 +0,0 @@ -import ejs from 'ejs'; -import { ManfredAwesomicCV } from '@/model'; -import { HardSkillVM, mapFromCvToHardSkillVm } from '@lemoncode/manfred-common/hard-skill-section'; -import hardSkillsSection from './hard-skills-section.ejs?raw'; - -export const generateHardSkillsSection = (cv: ManfredAwesomicCV): string => { - const hardSkillsSectionVm = mapFromCvToHardSkillVm(cv); - return generateHardSkillsSectionInner(hardSkillsSectionVm); -}; - -const generateHardSkillsSectionInner = (hardSkillsSectionVm: HardSkillVM[]): string => { - const rootObject = { - hardSkillsCollection: hardSkillsSectionVm, - }; - return ejs.render(hardSkillsSection, rootObject); -}; diff --git a/packages/manfred2html/src/engine/html-parts/html-document-start/html-document-start.part.ts b/packages/manfred2html/src/engine/html-parts/html-document-start/html-document-start.part.ts deleted file mode 100644 index f7c92c5d..00000000 --- a/packages/manfred2html/src/engine/html-parts/html-document-start/html-document-start.part.ts +++ /dev/null @@ -1,4 +0,0 @@ -import ejs from 'ejs'; -import htmlDocumentStartTemplate from './html-document-start.ejs?raw'; - -export const generateHtmlDocumentStart = (color: string): string => ejs.render(htmlDocumentStartTemplate, { color }); diff --git a/packages/manfred2html/src/engine/html-parts/language-section/language-section.part.ts b/packages/manfred2html/src/engine/html-parts/language-section/language-section.part.ts deleted file mode 100644 index f27fbf9b..00000000 --- a/packages/manfred2html/src/engine/html-parts/language-section/language-section.part.ts +++ /dev/null @@ -1,16 +0,0 @@ -import ejs from 'ejs'; -import { ManfredAwesomicCV } from '@/model'; -import { LanguageVm, mapFromCvToLanguageVm } from '@lemoncode/manfred-common/language-section' -import languageSection from './language-section.ejs?raw'; - -export const generateLanguageSection = (cv: ManfredAwesomicCV): string => { - const languageSectionVm = mapFromCvToLanguageVm(cv); - return generateLanguageSectionInner(languageSectionVm); -}; - -const generateLanguageSectionInner = (languageSectionVm: LanguageVm[]): string => { - const rootObject = { - languageCollection: languageSectionVm, - } - return ejs.render(languageSection, rootObject) -}; diff --git a/packages/manfred2html/src/engine/html-parts/relevants-links-section/relevants-links-section.part.ts b/packages/manfred2html/src/engine/html-parts/relevants-links-section/relevants-links-section.part.ts deleted file mode 100644 index 929d0526..00000000 --- a/packages/manfred2html/src/engine/html-parts/relevants-links-section/relevants-links-section.part.ts +++ /dev/null @@ -1,18 +0,0 @@ -import ejs from 'ejs'; -import { ManfredAwesomicCV } from '@/model'; -import { ProfileSectionVm, mapFromMacCvToProfileSectionVm } from '@lemoncode/manfred-common/profile-section'; -import relevantsLinksSection from './relevants-links-section.ejs?raw'; - -export const generateRelevantsLinksSection = (cv: ManfredAwesomicCV): string => { - const profileSectionVm = mapFromMacCvToProfileSectionVm(cv); - - return generateRelevantsLinksSectionInner(profileSectionVm); -}; - -const generateRelevantsLinksSectionInner = (profileSectionVm: ProfileSectionVm): string => { - const rootObject = { - profile: profileSectionVm, - }; - - return ejs.render(relevantsLinksSection, rootObject); -}; diff --git a/packages/manfred2html/src/engine/html-parts/soft-skills-section/soft-skills-section.part.ts b/packages/manfred2html/src/engine/html-parts/soft-skills-section/soft-skills-section.part.ts deleted file mode 100644 index 915d2484..00000000 --- a/packages/manfred2html/src/engine/html-parts/soft-skills-section/soft-skills-section.part.ts +++ /dev/null @@ -1,16 +0,0 @@ -import ejs from 'ejs'; -import { ManfredAwesomicCV } from '@/model'; -import { SoftSkillVM, mapFromCvToSoftSkillVm } from '@lemoncode/manfred-common/soft-skill-section'; -import softSkillsSection from './soft-skills-section.ejs?raw'; - -export const generateSoftSkillsSection = (cv: ManfredAwesomicCV): string => { - const softSkillsSectionVm = mapFromCvToSoftSkillVm(cv); - return generateSoftSkillsSectionInner(softSkillsSectionVm); -}; - -const generateSoftSkillsSectionInner = (softSkillsSectionVm: SoftSkillVM[]): string => { - const rootObject = { - softSkillsCollection: softSkillsSectionVm, - }; - return ejs.render(softSkillsSection, rootObject); -}; diff --git a/packages/manfred2html/src/engine/html-parts/studies-section/studies-section.part.ts b/packages/manfred2html/src/engine/html-parts/studies-section/studies-section.part.ts deleted file mode 100644 index 512e6471..00000000 --- a/packages/manfred2html/src/engine/html-parts/studies-section/studies-section.part.ts +++ /dev/null @@ -1,18 +0,0 @@ -import ejs from 'ejs'; -import { StudiesSectionVm, mapFromMacCvToStudiesSectionVm } from '@lemoncode/manfred-common/studies-section'; -import { ManfredAwesomicCV } from '@/model'; -import studiesTemplate from './studies-section.ejs?raw'; - -export const generateStudiesSection = (cv: ManfredAwesomicCV): string => { - const studiesSectionVm = mapFromMacCvToStudiesSectionVm(cv); - - return generateStudiesSectionInner(studiesSectionVm); -}; - -const generateStudiesSectionInner = (studiesSectionVm: StudiesSectionVm[]): string => { - const rootObject = { - studiesCollection: studiesSectionVm, - }; - - return ejs.render(studiesTemplate, rootObject); -}; diff --git a/packages/manfred2html/src/engine/index.ts b/packages/manfred2html/src/engine/index.ts index 02cb6f68..a1069a23 100644 --- a/packages/manfred2html/src/engine/index.ts +++ b/packages/manfred2html/src/engine/index.ts @@ -1,57 +1,20 @@ import { ManfredAwesomicCV, ExportHTMLSettings } from '@/model'; -import { - generateHtmlDocumentStart, - generateHtmlDocumentEnd, - generateHeaderElementStart, - generateHeaderElementEnd, - generateAboutMeSection, - generateAsideElementStart, - generateAsideElementEnd, - generateRelevantsLinksSection, - generateLanguageSection, - generateHardSkillsSection, - generateSoftSkillsSection, - generateMainElementStart, - generateMainElementEnd, - generateExperiencesSection, - generateStudiesSection, -} from './html-parts'; +import { mapExportHTMLSettingsToSettings } from '@/mappers'; +import { exportManfredJSonToHTMLTemplateA } from './template-a'; +import { exportManfredJSonToHTMLTemplateB } from './template-b'; -export const exportManfredJSonToHTML = ( +export const exportHTMLTemplate = ( manfredJsonContent: ManfredAwesomicCV, exportHTMLSettings: ExportHTMLSettings ): string => { - const htmlDocumentStart = generateHtmlDocumentStart(exportHTMLSettings.primaryColor); - const htmlDocumentEnd = generateHtmlDocumentEnd(); - const headerElementStart = generateHeaderElementStart(); - const headerElementEnd = generateHeaderElementEnd(); - const aboutMeSection = generateAboutMeSection(manfredJsonContent); - const asideElementStart = generateAsideElementStart(); - const asideElementEnd = generateAsideElementEnd(); - const relevantsLinksSection = generateRelevantsLinksSection(manfredJsonContent); - const mainElementStart = generateMainElementStart(); - const mainElementEnd = generateMainElementEnd(); - const languageSection = generateLanguageSection(manfredJsonContent); - const hardSkillsSection = generateHardSkillsSection(manfredJsonContent); - const softSkillsSection = generateSoftSkillsSection(manfredJsonContent); - const experienceSection = generateExperiencesSection(manfredJsonContent); - const studiesSection = generateStudiesSection(manfredJsonContent); + const settings = mapExportHTMLSettingsToSettings(exportHTMLSettings); - return ` - ${htmlDocumentStart} - ${headerElementStart} - ${aboutMeSection} - ${headerElementEnd} - ${asideElementStart} - ${relevantsLinksSection} - ${languageSection} - ${hardSkillsSection} - ${softSkillsSection} - ${asideElementEnd} - ${mainElementStart} - ${experienceSection} - ${studiesSection} - ${mainElementEnd} - ${htmlDocumentEnd} - `; + switch (settings.template) { + case 'Moderno elegante': + return exportManfredJSonToHTMLTemplateA(manfredJsonContent, settings); + case 'Limpio y organizado': + return exportManfredJSonToHTMLTemplateB(manfredJsonContent, settings); + default: + throw new Error('Template not found'); + } }; diff --git a/packages/manfred2html/src/engine/html-parts/about-me-section/about-me-section.ejs b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/about-me-section.ejs similarity index 100% rename from packages/manfred2html/src/engine/html-parts/about-me-section/about-me-section.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/about-me-section/about-me-section.ejs diff --git a/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/about-me-section.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/about-me-section.part.ts new file mode 100644 index 00000000..96b7a585 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/about-me-section.part.ts @@ -0,0 +1,24 @@ +import ejs from 'ejs'; +import { ProfileSectionVm, mapFromMacCvToProfileSectionVm } from '@lemoncode/manfred-common/profile-section'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { ManfredAwesomicCV, Settings, Language } from '@/model'; +import { getLabels } from './labels'; +import aboutMe from './about-me-section.ejs?raw'; + +export const generateAboutMeSection = (cv: ManfredAwesomicCV, settings: Settings): string => { + const profileSectionVm = mapFromMacCvToProfileSectionVm(cv); + + return generateAboutMeSectionInner(profileSectionVm, settings.language); +}; + +const generateAboutMeSectionInner = ( + profileSectionVm: ProfileSectionVm, + language: Language = ISO_SPANISH_LANGUAGE +): string => { + const rootObject = { + profile: profileSectionVm, + labels: getLabels(language), + }; + + return ejs.render(aboutMe, rootObject); +}; diff --git a/packages/manfred2html/src/engine/html-parts/about-me-section/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/about-me-section/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/about-me-section/index.ts diff --git a/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/about-me-english-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/about-me-english-labels.const.ts new file mode 100644 index 00000000..7d85fc96 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/about-me-english-labels.const.ts @@ -0,0 +1,5 @@ +import { AboutMeLabels } from './about-me-labels.model'; + +export const englishAboutMeLabels: AboutMeLabels = { + ABOUT_ME_HEADING: 'About me', +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/about-me-labels.model.ts b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/about-me-labels.model.ts new file mode 100644 index 00000000..ff37c169 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/about-me-labels.model.ts @@ -0,0 +1,3 @@ +export interface AboutMeLabels { + ABOUT_ME_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/about-me-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/about-me-spanish-labels.const.ts new file mode 100644 index 00000000..3aa4c27d --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/about-me-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { AboutMeLabels } from './about-me-labels.model'; + +export const spanishAboutMeLabels: AboutMeLabels = { + ABOUT_ME_HEADING: 'Sobre mí', +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/index.ts new file mode 100644 index 00000000..cfad900e --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/about-me-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { AboutMeLabels } from './about-me-labels.model'; +import { spanishAboutMeLabels } from './about-me-spanish-labels.const'; +import { englishAboutMeLabels } from './about-me-english-labels.const'; + +export const getLabels = (language: Language): AboutMeLabels => { + switch (language) { + case 'es': + return spanishAboutMeLabels; + case 'en': + return englishAboutMeLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/html-parts/aside-element-end/aside-element-end.ejs b/packages/manfred2html/src/engine/template-a/html-parts/aside-element-end/aside-element-end.ejs similarity index 100% rename from packages/manfred2html/src/engine/html-parts/aside-element-end/aside-element-end.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/aside-element-end/aside-element-end.ejs diff --git a/packages/manfred2html/src/engine/html-parts/aside-element-end/aside-element-end.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/aside-element-end/aside-element-end.part.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/aside-element-end/aside-element-end.part.ts rename to packages/manfred2html/src/engine/template-a/html-parts/aside-element-end/aside-element-end.part.ts diff --git a/packages/manfred2html/src/engine/html-parts/aside-element-end/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/aside-element-end/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/aside-element-end/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/aside-element-end/index.ts diff --git a/packages/manfred2html/src/engine/html-parts/aside-element-start/aside-element-start.ejs b/packages/manfred2html/src/engine/template-a/html-parts/aside-element-start/aside-element-start.ejs similarity index 100% rename from packages/manfred2html/src/engine/html-parts/aside-element-start/aside-element-start.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/aside-element-start/aside-element-start.ejs diff --git a/packages/manfred2html/src/engine/html-parts/aside-element-start/aside-element-start.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/aside-element-start/aside-element-start.part.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/aside-element-start/aside-element-start.part.ts rename to packages/manfred2html/src/engine/template-a/html-parts/aside-element-start/aside-element-start.part.ts diff --git a/packages/manfred2html/src/engine/html-parts/aside-element-start/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/aside-element-start/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/aside-element-start/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/aside-element-start/index.ts diff --git a/packages/manfred2html/src/engine/html-parts/experience-section/experience-section.ejs b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/experience-section.ejs similarity index 57% rename from packages/manfred2html/src/engine/html-parts/experience-section/experience-section.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/experience-section/experience-section.ejs index 5e68152e..5baa5525 100644 --- a/packages/manfred2html/src/engine/html-parts/experience-section/experience-section.ejs +++ b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/experience-section.ejs @@ -1,16 +1,23 @@ <%_ if(experienceCollection && experienceCollection.length !== 0){ -%>
-

Experiencia / carrera

+

+ + <%- labels.EXPERIENCE_CAREER_HEADING %> +

<%_ for(const experience of experienceCollection){ -%>
-

Inicio: <%- experience.roles[0].startDate %>

- <%_ if(experience.roles[0].finishDate || experience.roles[0].finishDate === 'Actualidad') { -%> -

Fin: <%- experience.roles[0].finishDate %>

- <%_ } -%> +

Inicio: <%- new Date(experience.roles[0].startDate).toLocaleDateString(undefined, { year:"numeric", month:"short"}) %>

+

Fin: + <%_ if(experience.roles[0].finishDate && experience.roles[0].finishDate.toLowerCase() !== 'actualidad') { -%> + <%- new Date(experience.roles[0].finishDate).toLocaleDateString(undefined, { year:"numeric", month:"short"}) %> +

+ <%_ } else { -%> + Actualidad

+ <%_}-%>
@@ -24,10 +31,12 @@ <%_ } -%>
-

Inicio: <%- experience.roles[0].startDate %>

- <%_ if(experience.roles[0].finishDate || experience.roles[0].finishDate === 'Actualidad') { -%> -

Fin: <%- experience.roles[0].finishDate %>

- <%_ } -%> + <%- new Date(experience.roles[0].startDate).toLocaleDateString(undefined, { year:"numeric", month:"short"}) %> + <%_ if(experience.roles[0].finishDate && experience.roles[0].finishDate.toLowerCase() !== 'actualidad') { -%> + <%- " - "+new Date(experience.roles[0].finishDate).toLocaleDateString(undefined, { year:"numeric", month:"short"}) %> + <%_ } else { -%> + - Actualidad

+ <%_}-%>
<%_ if(experience.type) { -%> diff --git a/packages/manfred2html/src/engine/html-parts/experience-section/experience-section.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/experience-section.part.ts similarity index 52% rename from packages/manfred2html/src/engine/html-parts/experience-section/experience-section.part.ts rename to packages/manfred2html/src/engine/template-a/html-parts/experience-section/experience-section.part.ts index fc8140f3..ad199a72 100644 --- a/packages/manfred2html/src/engine/html-parts/experience-section/experience-section.part.ts +++ b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/experience-section.part.ts @@ -1,17 +1,23 @@ import ejs from 'ejs'; import { ExperienceVm, mapFromMacCvToExperienceSectionVm } from '@lemoncode/manfred-common/experience-section'; -import { ManfredAwesomicCV } from '@/model'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { Settings, Language, ManfredAwesomicCV } from '@/model'; import experienceTemplate from './experience-section.ejs?raw'; +import { getLabels } from './labels'; -export const generateExperiencesSection = (cv: ManfredAwesomicCV): string => { +export const generateExperiencesSection = (cv: ManfredAwesomicCV, settings: Settings): string => { const experienceSectionVm = mapFromMacCvToExperienceSectionVm(cv); - return generateExperienceSectionInner(experienceSectionVm); + return generateExperienceSectionInner(experienceSectionVm, settings.language); }; -const generateExperienceSectionInner = (experienceSectionVm: ExperienceVm[]): string => { +const generateExperienceSectionInner = ( + experienceSectionVm: ExperienceVm[], + language: Language = ISO_SPANISH_LANGUAGE +): string => { const rootObject = { experienceCollection: experienceSectionVm, + labels: getLabels(language), }; return ejs.render(experienceTemplate, rootObject); diff --git a/packages/manfred2html/src/engine/template-a/html-parts/experience-section/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/index.ts new file mode 100644 index 00000000..fe1418c2 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/index.ts @@ -0,0 +1 @@ +export * from './experience-section.part'; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/experience-english-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/experience-english-labels.const.ts new file mode 100644 index 00000000..32bfca4b --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/experience-english-labels.const.ts @@ -0,0 +1,5 @@ +import { ExperienceLabels } from './experience-label.model'; + +export const englishExperienceLabels: ExperienceLabels = { + EXPERIENCE_CAREER_HEADING: 'Experience / Career', +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/experience-label.model.ts b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/experience-label.model.ts new file mode 100644 index 00000000..6f3c04e3 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/experience-label.model.ts @@ -0,0 +1,3 @@ +export interface ExperienceLabels { + EXPERIENCE_CAREER_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/experience-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/experience-spanish-labels.const.ts new file mode 100644 index 00000000..40dee25d --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/experience-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { ExperienceLabels } from './experience-label.model'; + +export const spanishExperienceLabels: ExperienceLabels = { + EXPERIENCE_CAREER_HEADING: 'Experiencia / Carrera', +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/index.ts new file mode 100644 index 00000000..bf9c695e --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/experience-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { ExperienceLabels } from './experience-label.model'; +import { spanishExperienceLabels } from './experience-spanish-labels.const'; +import { englishExperienceLabels } from './experience-english-labels.const'; + +export const getLabels = (language: Language): ExperienceLabels => { + switch (language) { + case 'es': + return spanishExperienceLabels; + case 'en': + return englishExperienceLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/html-parts/hard-skills-section/hard-skills-section.ejs b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/hard-skills-section.ejs similarity index 94% rename from packages/manfred2html/src/engine/html-parts/hard-skills-section/hard-skills-section.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/hard-skills-section.ejs index 8006addc..28d98ed8 100644 --- a/packages/manfred2html/src/engine/html-parts/hard-skills-section/hard-skills-section.ejs +++ b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/hard-skills-section.ejs @@ -17,7 +17,9 @@ />
-

HARD SKILLS

+

+ <%- labels.HARD_SKILLS_HEADING %> +

diff --git a/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/hard-skills-section.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/hard-skills-section.part.ts new file mode 100644 index 00000000..6cf5af41 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/hard-skills-section.part.ts @@ -0,0 +1,22 @@ +import ejs from 'ejs'; +import { HardSkillVM, mapFromCvToHardSkillVm } from '@lemoncode/manfred-common/hard-skill-section'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { Settings, Language, ManfredAwesomicCV } from '@/model'; +import { getLabels } from './labels'; +import hardSkillsTemplate from './hard-skills-section.ejs?raw'; + +export const generateHardSkillsSection = (cv: ManfredAwesomicCV, settings: Settings): string => { + const hardSkillsSectionVm = mapFromCvToHardSkillVm(cv); + return generateHardSkillsSectionInner(hardSkillsSectionVm, settings.language); +}; + +const generateHardSkillsSectionInner = ( + hardSkillsSectionVm: HardSkillVM[], + language: Language = ISO_SPANISH_LANGUAGE +): string => { + const rootObject = { + hardSkillsCollection: hardSkillsSectionVm, + labels: getLabels(language), + }; + return ejs.render(hardSkillsTemplate, rootObject); +}; diff --git a/packages/manfred2html/src/engine/html-parts/hard-skills-section/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/hard-skills-section/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/index.ts diff --git a/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/hard-skills-english-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/hard-skills-english-labels.const.ts new file mode 100644 index 00000000..57fc749e --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/hard-skills-english-labels.const.ts @@ -0,0 +1,5 @@ +import { HardSkillsLabels } from './hard-skills-label.model'; + +export const englishHardSkillsLabels: HardSkillsLabels = { + HARD_SKILLS_HEADING: 'Hard Skills', +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/hard-skills-label.model.ts b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/hard-skills-label.model.ts new file mode 100644 index 00000000..c054c0db --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/hard-skills-label.model.ts @@ -0,0 +1,3 @@ +export interface HardSkillsLabels { + HARD_SKILLS_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/hard-skills-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/hard-skills-spanish-labels.const.ts new file mode 100644 index 00000000..688d9216 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/hard-skills-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { HardSkillsLabels } from './hard-skills-label.model'; + +export const spanishHardSkillsLabels: HardSkillsLabels = { + HARD_SKILLS_HEADING: 'Competencias', +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/index.ts new file mode 100644 index 00000000..2c8f54f5 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/hard-skills-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { HardSkillsLabels } from './hard-skills-label.model'; +import { spanishHardSkillsLabels } from './hard-skills-spanish-labels.const'; +import { englishHardSkillsLabels } from './hard-skills-english-labels.const'; + +export const getLabels = (language: Language): HardSkillsLabels => { + switch (language) { + case 'es': + return spanishHardSkillsLabels; + case 'en': + return englishHardSkillsLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/html-parts/header-element-end/header-element-end.ejs b/packages/manfred2html/src/engine/template-a/html-parts/header-element-end/header-element-end.ejs similarity index 100% rename from packages/manfred2html/src/engine/html-parts/header-element-end/header-element-end.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/header-element-end/header-element-end.ejs diff --git a/packages/manfred2html/src/engine/html-parts/header-element-end/header-element-end.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/header-element-end/header-element-end.part.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/header-element-end/header-element-end.part.ts rename to packages/manfred2html/src/engine/template-a/html-parts/header-element-end/header-element-end.part.ts diff --git a/packages/manfred2html/src/engine/html-parts/header-element-end/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/header-element-end/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/header-element-end/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/header-element-end/index.ts diff --git a/packages/manfred2html/src/engine/html-parts/header-element-start/header-element-start.ejs b/packages/manfred2html/src/engine/template-a/html-parts/header-element-start/header-element-start.ejs similarity index 100% rename from packages/manfred2html/src/engine/html-parts/header-element-start/header-element-start.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/header-element-start/header-element-start.ejs diff --git a/packages/manfred2html/src/engine/html-parts/header-element-start/header-element-start.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/header-element-start/header-element-start.part.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/header-element-start/header-element-start.part.ts rename to packages/manfred2html/src/engine/template-a/html-parts/header-element-start/header-element-start.part.ts diff --git a/packages/manfred2html/src/engine/html-parts/header-element-start/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/header-element-start/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/header-element-start/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/header-element-start/index.ts diff --git a/packages/manfred2html/src/engine/html-parts/html-document-end/html-document-end.ejs b/packages/manfred2html/src/engine/template-a/html-parts/html-document-end/html-document-end.ejs similarity index 100% rename from packages/manfred2html/src/engine/html-parts/html-document-end/html-document-end.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/html-document-end/html-document-end.ejs diff --git a/packages/manfred2html/src/engine/html-parts/html-document-end/html-document-end.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/html-document-end/html-document-end.part.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/html-document-end/html-document-end.part.ts rename to packages/manfred2html/src/engine/template-a/html-parts/html-document-end/html-document-end.part.ts diff --git a/packages/manfred2html/src/engine/html-parts/html-document-end/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/html-document-end/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/html-document-end/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/html-document-end/index.ts diff --git a/packages/manfred2html/src/engine/html-parts/html-document-start/html-document-start.ejs b/packages/manfred2html/src/engine/template-a/html-parts/html-document-start/html-document-start.ejs similarity index 97% rename from packages/manfred2html/src/engine/html-parts/html-document-start/html-document-start.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/html-document-start/html-document-start.ejs index 7439a53b..72c2581d 100644 --- a/packages/manfred2html/src/engine/html-parts/html-document-start/html-document-start.ejs +++ b/packages/manfred2html/src/engine/template-a/html-parts/html-document-start/html-document-start.ejs @@ -1,5 +1,5 @@ - - + + @@ -286,6 +286,7 @@ display: flex; flex-direction: column; gap: var(--spacing_8); + text-transform: capitalize; } .main__section__item > .date-desktop { display: none; @@ -317,8 +318,11 @@ } .main__section__item > .date-desktop { display: flex; + flex-direction: column; + gap: var(--spacing_8); min-width: max-content; - align-items: flex-end; + text-align: end; + padding-top: var(--spacing_8); } .section__content__header > h3 { font-size: 24px; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/html-document-start/html-document-start.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/html-document-start/html-document-start.part.ts new file mode 100644 index 00000000..08456f9e --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/html-document-start/html-document-start.part.ts @@ -0,0 +1,5 @@ +import ejs from 'ejs'; +import { HexColor } from '@/model'; +import htmlDocumentStartTemplate from './html-document-start.ejs?raw'; + +export const generateHtmlDocumentStart = (color: HexColor): string => ejs.render(htmlDocumentStartTemplate, { color }); diff --git a/packages/manfred2html/src/engine/html-parts/html-document-start/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/html-document-start/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/html-document-start/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/html-document-start/index.ts diff --git a/packages/manfred2html/src/engine/html-parts/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/index.ts diff --git a/packages/manfred2html/src/engine/html-parts/language-section/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/language-section/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/language-section/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/language-section/index.ts diff --git a/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/index.ts new file mode 100644 index 00000000..eca31dab --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { LanguageLabels } from './language-label.model'; +import { spanishLanguageLabels } from './language-spanish-labels.const'; +import { englishLanguageLabels } from './language-english-labels.const'; + +export const getLabels = (language: Language): LanguageLabels => { + switch (language) { + case 'es': + return spanishLanguageLabels; + case 'en': + return englishLanguageLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/language-english-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/language-english-labels.const.ts new file mode 100644 index 00000000..295f50eb --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/language-english-labels.const.ts @@ -0,0 +1,5 @@ +import { LanguageLabels } from './language-label.model'; + +export const englishLanguageLabels: LanguageLabels = { + LANGUAGE_HEADING: 'Languages', +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/language-label.model.ts b/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/language-label.model.ts new file mode 100644 index 00000000..1151ffd1 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/language-label.model.ts @@ -0,0 +1,3 @@ +export interface LanguageLabels { + LANGUAGE_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/language-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/language-spanish-labels.const.ts new file mode 100644 index 00000000..0649bad0 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/language-section/labels/language-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { LanguageLabels } from './language-label.model'; + +export const spanishLanguageLabels: LanguageLabels = { + LANGUAGE_HEADING: 'Idiomas', +}; diff --git a/packages/manfred2html/src/engine/html-parts/language-section/language-section.ejs b/packages/manfred2html/src/engine/template-a/html-parts/language-section/language-section.ejs similarity index 94% rename from packages/manfred2html/src/engine/html-parts/language-section/language-section.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/language-section/language-section.ejs index 4d9e0ec2..12ab858b 100644 --- a/packages/manfred2html/src/engine/html-parts/language-section/language-section.ejs +++ b/packages/manfred2html/src/engine/template-a/html-parts/language-section/language-section.ejs @@ -17,7 +17,9 @@ />
-

LENGUAJE / NIVEL

+

+ <%- labels.LANGUAGE_HEADING %> +

diff --git a/packages/manfred2html/src/engine/template-a/html-parts/language-section/language-section.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/language-section/language-section.part.ts new file mode 100644 index 00000000..4a912d6c --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/language-section/language-section.part.ts @@ -0,0 +1,22 @@ +import ejs from 'ejs'; +import { LanguageVm, mapFromCvToLanguageVm } from '@lemoncode/manfred-common/language-section'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { ManfredAwesomicCV, Settings, Language } from '@/model'; +import { getLabels } from './labels'; +import languageTemplate from './language-section.ejs?raw'; + +export const generateLanguageSection = (cv: ManfredAwesomicCV, settings: Settings): string => { + const languageSectionVm = mapFromCvToLanguageVm(cv); + return generateLanguageSectionInner(languageSectionVm, settings.language); +}; + +const generateLanguageSectionInner = ( + languageSectionVm: LanguageVm[], + language: Language = ISO_SPANISH_LANGUAGE +): string => { + const rootObject = { + languageCollection: languageSectionVm, + labels: getLabels(language), + }; + return ejs.render(languageTemplate, rootObject); +}; diff --git a/packages/manfred2html/src/engine/html-parts/main-element-end/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/main-element-end/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/main-element-end/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/main-element-end/index.ts diff --git a/packages/manfred2html/src/engine/html-parts/main-element-end/main-element-end.ejs b/packages/manfred2html/src/engine/template-a/html-parts/main-element-end/main-element-end.ejs similarity index 100% rename from packages/manfred2html/src/engine/html-parts/main-element-end/main-element-end.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/main-element-end/main-element-end.ejs diff --git a/packages/manfred2html/src/engine/html-parts/main-element-end/main-element-end.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/main-element-end/main-element-end.part.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/main-element-end/main-element-end.part.ts rename to packages/manfred2html/src/engine/template-a/html-parts/main-element-end/main-element-end.part.ts diff --git a/packages/manfred2html/src/engine/html-parts/main-element-start/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/main-element-start/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/main-element-start/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/main-element-start/index.ts diff --git a/packages/manfred2html/src/engine/html-parts/main-element-start/main-element-start.ejs b/packages/manfred2html/src/engine/template-a/html-parts/main-element-start/main-element-start.ejs similarity index 100% rename from packages/manfred2html/src/engine/html-parts/main-element-start/main-element-start.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/main-element-start/main-element-start.ejs diff --git a/packages/manfred2html/src/engine/html-parts/main-element-start/main-element-start.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/main-element-start/main-element-start.part.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/main-element-start/main-element-start.part.ts rename to packages/manfred2html/src/engine/template-a/html-parts/main-element-start/main-element-start.part.ts diff --git a/packages/manfred2html/src/engine/html-parts/relevants-links-section/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/relevants-links-section/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/index.ts diff --git a/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/index.ts new file mode 100644 index 00000000..41c9f130 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { RelevantsLinksLabels } from './relevants-links-label.model'; +import { spanishRelevantsLinksLabels } from './relevants-links-spanish-labels.const'; +import { englishRelevantsLinksLabels } from './relevants-links-english-labels.const'; + +export const getLabels = (language: Language): RelevantsLinksLabels => { + switch (language) { + case 'es': + return spanishRelevantsLinksLabels; + case 'en': + return englishRelevantsLinksLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/relevants-links-english-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/relevants-links-english-labels.const.ts new file mode 100644 index 00000000..47316820 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/relevants-links-english-labels.const.ts @@ -0,0 +1,5 @@ +import { RelevantsLinksLabels } from './relevants-links-label.model'; + +export const englishRelevantsLinksLabels: RelevantsLinksLabels = { + RELEVANTS_LINKS_HEADING: 'My Links', +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/relevants-links-label.model.ts b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/relevants-links-label.model.ts new file mode 100644 index 00000000..7569f913 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/relevants-links-label.model.ts @@ -0,0 +1,3 @@ +export interface RelevantsLinksLabels { + RELEVANTS_LINKS_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/relevants-links-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/relevants-links-spanish-labels.const.ts new file mode 100644 index 00000000..7fd7feb8 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/labels/relevants-links-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { RelevantsLinksLabels } from './relevants-links-label.model'; + +export const spanishRelevantsLinksLabels: RelevantsLinksLabels = { + RELEVANTS_LINKS_HEADING: 'Mis enlaces', +}; diff --git a/packages/manfred2html/src/engine/html-parts/relevants-links-section/relevants-links-section.ejs b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/relevants-links-section.ejs similarity index 96% rename from packages/manfred2html/src/engine/html-parts/relevants-links-section/relevants-links-section.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/relevants-links-section.ejs index d1cbb86f..011fffde 100644 --- a/packages/manfred2html/src/engine/html-parts/relevants-links-section/relevants-links-section.ejs +++ b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/relevants-links-section.ejs @@ -14,7 +14,9 @@ />
-

mis enlaces

+

+ <%- labels.RELEVANTS_LINKS_HEADING %> +

@@ -75,17 +77,18 @@ <%_ if (link.type === 'twitter') { -%>
- - + class="svg-fill" + width="20" + height="19" + viewBox="0 0 20 19" + fill="none" + xmlns="http://www.w3.org/2000/svg" + > + + twitter
<%_ } %> diff --git a/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/relevants-links-section.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/relevants-links-section.part.ts new file mode 100644 index 00000000..40f1f94c --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/relevants-links-section/relevants-links-section.part.ts @@ -0,0 +1,24 @@ +import ejs from 'ejs'; +import { ProfileSectionVm, mapFromMacCvToProfileSectionVm } from '@lemoncode/manfred-common/profile-section'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { ManfredAwesomicCV, Settings, Language } from '@/model'; +import { getLabels } from './labels'; +import relevantsLinksSection from './relevants-links-section.ejs?raw'; + +export const generateRelevantsLinksSection = (cv: ManfredAwesomicCV, settings: Settings): string => { + const profileSectionVm = mapFromMacCvToProfileSectionVm(cv); + + return generateRelevantsLinksSectionInner(profileSectionVm, settings.language); +}; + +const generateRelevantsLinksSectionInner = ( + profileSectionVm: ProfileSectionVm, + language: Language = ISO_SPANISH_LANGUAGE +): string => { + const rootObject = { + profile: profileSectionVm, + labels: getLabels(language), + }; + + return ejs.render(relevantsLinksSection, rootObject); +}; diff --git a/packages/manfred2html/src/engine/html-parts/soft-skills-section/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/soft-skills-section/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/index.ts diff --git a/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/index.ts new file mode 100644 index 00000000..9529c12a --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { SoftSkillsLabels } from './soft-skills-label.model'; +import { spanishSoftSkillsLabels } from './soft-skills-spanish-labels.const'; +import { englishSoftSkillsLabels } from './soft-skills-english-labels.const'; + +export const getLabels = (language: Language): SoftSkillsLabels => { + switch (language) { + case 'es': + return spanishSoftSkillsLabels; + case 'en': + return englishSoftSkillsLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/soft-skills-english-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/soft-skills-english-labels.const.ts new file mode 100644 index 00000000..d2510c35 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/soft-skills-english-labels.const.ts @@ -0,0 +1,5 @@ +import { SoftSkillsLabels } from './soft-skills-label.model'; + +export const englishSoftSkillsLabels: SoftSkillsLabels = { + SOFT_SKILLS_HEADING: 'Soft skills', +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/soft-skills-label.model.ts b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/soft-skills-label.model.ts new file mode 100644 index 00000000..602ec990 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/soft-skills-label.model.ts @@ -0,0 +1,3 @@ +export interface SoftSkillsLabels { + SOFT_SKILLS_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/soft-skills-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/soft-skills-spanish-labels.const.ts new file mode 100644 index 00000000..446d1fe1 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/labels/soft-skills-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { SoftSkillsLabels } from './soft-skills-label.model'; + +export const spanishSoftSkillsLabels: SoftSkillsLabels = { + SOFT_SKILLS_HEADING: 'Habilidades', +}; diff --git a/packages/manfred2html/src/engine/html-parts/soft-skills-section/soft-skills-section.ejs b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/soft-skills-section.ejs similarity index 94% rename from packages/manfred2html/src/engine/html-parts/soft-skills-section/soft-skills-section.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/soft-skills-section.ejs index 4595a44d..7c71b24c 100644 --- a/packages/manfred2html/src/engine/html-parts/soft-skills-section/soft-skills-section.ejs +++ b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/soft-skills-section.ejs @@ -17,7 +17,9 @@ />
-

SOFT SKILLS

+

+ <%- labels.SOFT_SKILLS_HEADING %> +

@@ -28,4 +30,4 @@
<%_ } -%> - \ No newline at end of file + diff --git a/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/soft-skills-section.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/soft-skills-section.part.ts new file mode 100644 index 00000000..9e3a9fbc --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/soft-skills-section/soft-skills-section.part.ts @@ -0,0 +1,22 @@ +import ejs from 'ejs'; +import { SoftSkillVM, mapFromCvToSoftSkillVm } from '@lemoncode/manfred-common/soft-skill-section'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { ManfredAwesomicCV, Settings, Language } from '@/model'; +import { getLabels } from './labels'; +import softSkillsTemplate from './soft-skills-section.ejs?raw'; + +export const generateSoftSkillsSection = (cv: ManfredAwesomicCV, settings: Settings): string => { + const softSkillsSectionVm = mapFromCvToSoftSkillVm(cv); + return generateSoftSkillsSectionInner(softSkillsSectionVm, settings.language); +}; + +const generateSoftSkillsSectionInner = ( + softSkillsSectionVm: SoftSkillVM[], + language: Language = ISO_SPANISH_LANGUAGE +): string => { + const rootObject = { + softSkillsCollection: softSkillsSectionVm, + labels: getLabels(language), + }; + return ejs.render(softSkillsTemplate, rootObject); +}; diff --git a/packages/manfred2html/src/engine/html-parts/studies-section/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/index.ts similarity index 100% rename from packages/manfred2html/src/engine/html-parts/studies-section/index.ts rename to packages/manfred2html/src/engine/template-a/html-parts/studies-section/index.ts diff --git a/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/index.ts b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/index.ts new file mode 100644 index 00000000..d0f8daeb --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { StudiesLabels } from './studies-label.model'; +import { spanishStudiesLabels } from './studies-spanish-labels.const'; +import { englishStudiesLabels } from './studies-english-labels.const'; + +export const getLabels = (language: Language): StudiesLabels => { + switch (language) { + case 'es': + return spanishStudiesLabels; + case 'en': + return englishStudiesLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/studies-english-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/studies-english-labels.const.ts new file mode 100644 index 00000000..e57fc9f9 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/studies-english-labels.const.ts @@ -0,0 +1,5 @@ +import { StudiesLabels } from './studies-label.model'; + +export const englishStudiesLabels: StudiesLabels = { + STUDIES_HEADING: 'Studies', +}; diff --git a/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/studies-label.model.ts b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/studies-label.model.ts new file mode 100644 index 00000000..27d0cf19 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/studies-label.model.ts @@ -0,0 +1,3 @@ +export interface StudiesLabels { + STUDIES_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/studies-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/studies-spanish-labels.const.ts new file mode 100644 index 00000000..0c35087e --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/labels/studies-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { StudiesLabels } from './studies-label.model'; + +export const spanishStudiesLabels: StudiesLabels = { + STUDIES_HEADING: 'Estudios', +}; diff --git a/packages/manfred2html/src/engine/html-parts/studies-section/studies-section.ejs b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/studies-section.ejs similarity index 68% rename from packages/manfred2html/src/engine/html-parts/studies-section/studies-section.ejs rename to packages/manfred2html/src/engine/template-a/html-parts/studies-section/studies-section.ejs index 0b56db2f..5e22f592 100644 --- a/packages/manfred2html/src/engine/html-parts/studies-section/studies-section.ejs +++ b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/studies-section.ejs @@ -1,16 +1,22 @@ <%_ if (studiesCollection && studiesCollection.length !== 0) { -%>
-

Educación

+

+ <%- labels.STUDIES_HEADING %> +

<%_ for (const study of studiesCollection) { -%>
-

Inicio: <%- study.startDate %>

- <%_ if (study.finishDate || study.finishDate === 'Actualidad') { -%> -

Fin: <%- study.finishDate %>

- <%_ } -%> +

Inicio: <%- new Date(study.startDate).toLocaleDateString(undefined, { year:"numeric", month:"short"}) %>

+

Fin: + <%_ if (study.finishDate || study.finishDate === 'Actualidad') { -%> + <%- new Date(study.finishDate).toLocaleDateString(undefined, { year:"numeric", month:"short"}) %> +

+ <%_ } else { -%> + Actualidad

+ <%_}-%>
@@ -24,10 +30,10 @@ <%_ } -%>
-

Inicio: <%- study.startDate %>

- <%_ if (study.finishDate || study.finishDate === 'Actualidad') { -%> -

Fin: <%- study.finishDate %>

- <%_ } -%> + <%- new Date(study.startDate).toLocaleDateString(undefined, { year:"numeric", month:"short"}) %> + <%_ if (study.finishDate || study.finishDate === 'Actualidad') { -%> + <%- " - "+new Date(study.finishDate).toLocaleDateString(undefined, { year:"numeric", month:"short"}) %>

+ <%_ } -%>

Tipo de estudios: <%- study.studyType %>

@@ -42,7 +48,7 @@ <%_ if (study.location) { -%>

Ubicación de la institución: -

<%- study.description %>

+

<%- study.description %>

<%- study.institution.location.region %> , <%- study.institution.location.country %>

<%_ } -%> @@ -52,4 +58,3 @@ <%_ } -%>
<%_ } -%> - \ No newline at end of file diff --git a/packages/manfred2html/src/engine/template-a/html-parts/studies-section/studies-section.part.ts b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/studies-section.part.ts new file mode 100644 index 00000000..ce48aa57 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/html-parts/studies-section/studies-section.part.ts @@ -0,0 +1,24 @@ +import ejs from 'ejs'; +import { StudiesSectionVm, mapFromMacCvToStudiesSectionVm } from '@lemoncode/manfred-common/studies-section'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { ManfredAwesomicCV, Settings, Language } from '@/model'; +import { getLabels } from './labels'; +import studiesTemplate from './studies-section.ejs?raw'; + +export const generateStudiesSection = (cv: ManfredAwesomicCV, settings: Settings): string => { + const studiesSectionVm = mapFromMacCvToStudiesSectionVm(cv); + + return generateStudiesSectionInner(studiesSectionVm, settings.language); +}; + +const generateStudiesSectionInner = ( + studiesSectionVm: StudiesSectionVm[], + language: Language = ISO_SPANISH_LANGUAGE +): string => { + const rootObject = { + studiesCollection: studiesSectionVm, + labels: getLabels(language), + }; + + return ejs.render(studiesTemplate, rootObject); +}; diff --git a/packages/manfred2html/src/engine/template-a/index.ts b/packages/manfred2html/src/engine/template-a/index.ts new file mode 100644 index 00000000..e5342552 --- /dev/null +++ b/packages/manfred2html/src/engine/template-a/index.ts @@ -0,0 +1,54 @@ +import { ManfredAwesomicCV, Settings } from '@/model'; +import { + generateHtmlDocumentStart, + generateHtmlDocumentEnd, + generateHeaderElementStart, + generateHeaderElementEnd, + generateAboutMeSection, + generateAsideElementStart, + generateAsideElementEnd, + generateRelevantsLinksSection, + generateLanguageSection, + generateHardSkillsSection, + generateSoftSkillsSection, + generateMainElementStart, + generateMainElementEnd, + generateExperiencesSection, + generateStudiesSection, +} from './html-parts'; + +export const exportManfredJSonToHTMLTemplateA = (manfredJsonContent: ManfredAwesomicCV, settings: Settings): string => { + const htmlDocumentStart = generateHtmlDocumentStart(settings.colorTheme); + const htmlDocumentEnd = generateHtmlDocumentEnd(); + const headerElementStart = generateHeaderElementStart(); + const headerElementEnd = generateHeaderElementEnd(); + const aboutMeSection = generateAboutMeSection(manfredJsonContent, settings); + const asideElementStart = generateAsideElementStart(); + const asideElementEnd = generateAsideElementEnd(); + const relevantsLinksSection = generateRelevantsLinksSection(manfredJsonContent, settings); + const mainElementStart = generateMainElementStart(); + const mainElementEnd = generateMainElementEnd(); + const languageSection = generateLanguageSection(manfredJsonContent, settings); + const hardSkillsSection = generateHardSkillsSection(manfredJsonContent, settings); + const softSkillsSection = generateSoftSkillsSection(manfredJsonContent, settings); + const experienceSection = generateExperiencesSection(manfredJsonContent, settings); + const studiesSection = generateStudiesSection(manfredJsonContent, settings); + + return ` + ${htmlDocumentStart} + ${headerElementStart} + ${aboutMeSection} + ${headerElementEnd} + ${asideElementStart} + ${relevantsLinksSection} + ${languageSection} + ${hardSkillsSection} + ${softSkillsSection} + ${asideElementEnd} + ${mainElementStart} + ${experienceSection} + ${studiesSection} + ${mainElementEnd} + ${htmlDocumentEnd} + `; +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/about-me-section.ejs b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/about-me-section.ejs new file mode 100644 index 00000000..b4a93ad7 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/about-me-section.ejs @@ -0,0 +1,11 @@ + <%_ if (profile && profile !== 'undefined' ) { -%> +
+
+

<%- labels.ABOUT_ME_HEADING %>

+
+
+

<%= profile?.description %>

+
+<%_ } -%> + + diff --git a/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/about-me-section.part.ts b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/about-me-section.part.ts new file mode 100644 index 00000000..96b7a585 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/about-me-section.part.ts @@ -0,0 +1,24 @@ +import ejs from 'ejs'; +import { ProfileSectionVm, mapFromMacCvToProfileSectionVm } from '@lemoncode/manfred-common/profile-section'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { ManfredAwesomicCV, Settings, Language } from '@/model'; +import { getLabels } from './labels'; +import aboutMe from './about-me-section.ejs?raw'; + +export const generateAboutMeSection = (cv: ManfredAwesomicCV, settings: Settings): string => { + const profileSectionVm = mapFromMacCvToProfileSectionVm(cv); + + return generateAboutMeSectionInner(profileSectionVm, settings.language); +}; + +const generateAboutMeSectionInner = ( + profileSectionVm: ProfileSectionVm, + language: Language = ISO_SPANISH_LANGUAGE +): string => { + const rootObject = { + profile: profileSectionVm, + labels: getLabels(language), + }; + + return ejs.render(aboutMe, rootObject); +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/index.ts new file mode 100644 index 00000000..b0ee7d15 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/index.ts @@ -0,0 +1 @@ +export * from './about-me-section.part'; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/about-me-english-labels.const.ts b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/about-me-english-labels.const.ts new file mode 100644 index 00000000..7d85fc96 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/about-me-english-labels.const.ts @@ -0,0 +1,5 @@ +import { AboutMeLabels } from './about-me-labels.model'; + +export const englishAboutMeLabels: AboutMeLabels = { + ABOUT_ME_HEADING: 'About me', +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/about-me-labels.model.ts b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/about-me-labels.model.ts new file mode 100644 index 00000000..ff37c169 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/about-me-labels.model.ts @@ -0,0 +1,3 @@ +export interface AboutMeLabels { + ABOUT_ME_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/about-me-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/about-me-spanish-labels.const.ts new file mode 100644 index 00000000..3aa4c27d --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/about-me-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { AboutMeLabels } from './about-me-labels.model'; + +export const spanishAboutMeLabels: AboutMeLabels = { + ABOUT_ME_HEADING: 'Sobre mí', +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/index.ts new file mode 100644 index 00000000..cfad900e --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/about-me-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { AboutMeLabels } from './about-me-labels.model'; +import { spanishAboutMeLabels } from './about-me-spanish-labels.const'; +import { englishAboutMeLabels } from './about-me-english-labels.const'; + +export const getLabels = (language: Language): AboutMeLabels => { + switch (language) { + case 'es': + return spanishAboutMeLabels; + case 'en': + return englishAboutMeLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/aside-element-end/aside-element-end.ejs b/packages/manfred2html/src/engine/template-b/html-parts/aside-element-end/aside-element-end.ejs new file mode 100644 index 00000000..0124ef29 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/aside-element-end/aside-element-end.ejs @@ -0,0 +1 @@ + diff --git a/packages/manfred2html/src/engine/template-b/html-parts/aside-element-end/aside-element-end.part.ts b/packages/manfred2html/src/engine/template-b/html-parts/aside-element-end/aside-element-end.part.ts new file mode 100644 index 00000000..34639985 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/aside-element-end/aside-element-end.part.ts @@ -0,0 +1,4 @@ +import ejs from 'ejs'; +import asideElementEndTemplate from './aside-element-end.ejs?raw'; + +export const generateAsideElementEnd = (): string => ejs.render(asideElementEndTemplate); diff --git a/packages/manfred2html/src/engine/template-b/html-parts/aside-element-end/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/aside-element-end/index.ts new file mode 100644 index 00000000..e1b267cb --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/aside-element-end/index.ts @@ -0,0 +1 @@ +export * from './aside-element-end.part'; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/aside-element-start/aside-element-start.ejs b/packages/manfred2html/src/engine/template-b/html-parts/aside-element-start/aside-element-start.ejs new file mode 100644 index 00000000..fbfaf4bc --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/aside-element-start/aside-element-start.ejs @@ -0,0 +1 @@ +
+ + diff --git a/packages/manfred2html/src/engine/template-b/html-parts/html-document-end/html-document-end.part.ts b/packages/manfred2html/src/engine/template-b/html-parts/html-document-end/html-document-end.part.ts new file mode 100644 index 00000000..43b00dee --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/html-document-end/html-document-end.part.ts @@ -0,0 +1,4 @@ +import ejs from 'ejs'; +import htmlDocumentEndTemplate from './html-document-end.ejs?raw'; + +export const generateHtmlDocumentEnd = (): string => ejs.render(htmlDocumentEndTemplate); diff --git a/packages/manfred2html/src/engine/template-b/html-parts/html-document-end/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/html-document-end/index.ts new file mode 100644 index 00000000..b8cab897 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/html-document-end/index.ts @@ -0,0 +1 @@ +export * from './html-document-end.part'; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/html-document-start/html-document-start.ejs b/packages/manfred2html/src/engine/template-b/html-parts/html-document-start/html-document-start.ejs new file mode 100644 index 00000000..baac6313 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/html-document-start/html-document-start.ejs @@ -0,0 +1,281 @@ + + + + + + + + + CV Manfred Export + + + +
+ diff --git a/packages/manfred2html/src/engine/template-b/html-parts/html-document-start/html-document-start.part.ts b/packages/manfred2html/src/engine/template-b/html-parts/html-document-start/html-document-start.part.ts new file mode 100644 index 00000000..08456f9e --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/html-document-start/html-document-start.part.ts @@ -0,0 +1,5 @@ +import ejs from 'ejs'; +import { HexColor } from '@/model'; +import htmlDocumentStartTemplate from './html-document-start.ejs?raw'; + +export const generateHtmlDocumentStart = (color: HexColor): string => ejs.render(htmlDocumentStartTemplate, { color }); diff --git a/packages/manfred2html/src/engine/template-b/html-parts/html-document-start/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/html-document-start/index.ts new file mode 100644 index 00000000..d4b22932 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/html-document-start/index.ts @@ -0,0 +1 @@ +export * from './html-document-start.part'; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/index.ts new file mode 100644 index 00000000..15718c41 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/index.ts @@ -0,0 +1,16 @@ +export * from './html-document-start'; +export * from './html-document-end'; +export * from './aside-element-start'; +export * from './aside-element-end'; +export * from './main-element-start'; +export * from './main-element-end'; +export * from './header-element-start'; +export * from './header-element-end'; +export * from './header-section'; +export * from './relevants-links-section'; +export * from './language-section'; +export * from './hard-skills-section'; +export * from './soft-skills-section'; +export * from './about-me-section'; +export * from './experience-section'; +export * from './studies-section'; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/language-section/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/language-section/index.ts new file mode 100644 index 00000000..c79bff55 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/language-section/index.ts @@ -0,0 +1 @@ +export * from './language-section.part'; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/index.ts new file mode 100644 index 00000000..eca31dab --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { LanguageLabels } from './language-label.model'; +import { spanishLanguageLabels } from './language-spanish-labels.const'; +import { englishLanguageLabels } from './language-english-labels.const'; + +export const getLabels = (language: Language): LanguageLabels => { + switch (language) { + case 'es': + return spanishLanguageLabels; + case 'en': + return englishLanguageLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/language-english-labels.const.ts b/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/language-english-labels.const.ts new file mode 100644 index 00000000..295f50eb --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/language-english-labels.const.ts @@ -0,0 +1,5 @@ +import { LanguageLabels } from './language-label.model'; + +export const englishLanguageLabels: LanguageLabels = { + LANGUAGE_HEADING: 'Languages', +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/language-label.model.ts b/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/language-label.model.ts new file mode 100644 index 00000000..1151ffd1 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/language-label.model.ts @@ -0,0 +1,3 @@ +export interface LanguageLabels { + LANGUAGE_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/language-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/language-spanish-labels.const.ts new file mode 100644 index 00000000..0649bad0 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/language-section/labels/language-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { LanguageLabels } from './language-label.model'; + +export const spanishLanguageLabels: LanguageLabels = { + LANGUAGE_HEADING: 'Idiomas', +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/language-section/language-section.ejs b/packages/manfred2html/src/engine/template-b/html-parts/language-section/language-section.ejs new file mode 100644 index 00000000..621014f1 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/language-section/language-section.ejs @@ -0,0 +1,11 @@ +<%_ if (languageCollection && languageCollection.length !== 0) { -%> +
+

<%- labels.LANGUAGE_HEADING %>

+
    + <%_ for (const language of languageCollection) { -%> +
  • <%- language.name %> (<%- language.level %>)
    • + <%_ } -%> +
+
+<%_ } -%> + diff --git a/packages/manfred2html/src/engine/template-b/html-parts/language-section/language-section.part.ts b/packages/manfred2html/src/engine/template-b/html-parts/language-section/language-section.part.ts new file mode 100644 index 00000000..1fc2debb --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/language-section/language-section.part.ts @@ -0,0 +1,22 @@ +import ejs from 'ejs'; +import { LanguageVm, mapFromCvToLanguageVm } from '@lemoncode/manfred-common/language-section'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { ManfredAwesomicCV, Settings, Language } from '@/model'; +import { getLabels } from './labels'; +import languageSection from './language-section.ejs?raw'; + +export const generateLanguageSection = (cv: ManfredAwesomicCV, settings: Settings): string => { + const languageSectionVm = mapFromCvToLanguageVm(cv); + return generateLanguageSectionInner(languageSectionVm, settings.language); +}; + +const generateLanguageSectionInner = ( + languageSectionVm: LanguageVm[], + language: Language = ISO_SPANISH_LANGUAGE +): string => { + const rootObject = { + languageCollection: languageSectionVm, + labels: getLabels(language), + }; + return ejs.render(languageSection, rootObject); +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/main-element-end/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/main-element-end/index.ts new file mode 100644 index 00000000..43da82c1 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/main-element-end/index.ts @@ -0,0 +1 @@ +export * from './main-element-end.part'; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/main-element-end/main-element-end.ejs b/packages/manfred2html/src/engine/template-b/html-parts/main-element-end/main-element-end.ejs new file mode 100644 index 00000000..0f4bf453 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/main-element-end/main-element-end.ejs @@ -0,0 +1 @@ + diff --git a/packages/manfred2html/src/engine/template-b/html-parts/main-element-end/main-element-end.part.ts b/packages/manfred2html/src/engine/template-b/html-parts/main-element-end/main-element-end.part.ts new file mode 100644 index 00000000..ad9c1b96 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/main-element-end/main-element-end.part.ts @@ -0,0 +1,4 @@ +import ejs from 'ejs'; +import mainElementEndTemplate from './main-element-end.ejs?raw'; + +export const generateMainElementEnd = (): string => ejs.render(mainElementEndTemplate); diff --git a/packages/manfred2html/src/engine/template-b/html-parts/main-element-start/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/main-element-start/index.ts new file mode 100644 index 00000000..5286e5ba --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/main-element-start/index.ts @@ -0,0 +1 @@ +export * from './main-element-start.part'; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/main-element-start/main-element-start.ejs b/packages/manfred2html/src/engine/template-b/html-parts/main-element-start/main-element-start.ejs new file mode 100644 index 00000000..506713e2 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/main-element-start/main-element-start.ejs @@ -0,0 +1 @@ +
diff --git a/packages/manfred2html/src/engine/template-b/html-parts/main-element-start/main-element-start.part.ts b/packages/manfred2html/src/engine/template-b/html-parts/main-element-start/main-element-start.part.ts new file mode 100644 index 00000000..0ebd42f9 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/main-element-start/main-element-start.part.ts @@ -0,0 +1,4 @@ +import ejs from 'ejs'; +import mainElementStartTemplate from './main-element-start.ejs?raw'; + +export const generateMainElementStart = (): string => ejs.render(mainElementStartTemplate); diff --git a/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/index.ts new file mode 100644 index 00000000..12fe55f6 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/index.ts @@ -0,0 +1 @@ +export * from './relevants-links-section.part'; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/index.ts new file mode 100644 index 00000000..41c9f130 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { RelevantsLinksLabels } from './relevants-links-label.model'; +import { spanishRelevantsLinksLabels } from './relevants-links-spanish-labels.const'; +import { englishRelevantsLinksLabels } from './relevants-links-english-labels.const'; + +export const getLabels = (language: Language): RelevantsLinksLabels => { + switch (language) { + case 'es': + return spanishRelevantsLinksLabels; + case 'en': + return englishRelevantsLinksLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/relevants-links-english-labels.const.ts b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/relevants-links-english-labels.const.ts new file mode 100644 index 00000000..47316820 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/relevants-links-english-labels.const.ts @@ -0,0 +1,5 @@ +import { RelevantsLinksLabels } from './relevants-links-label.model'; + +export const englishRelevantsLinksLabels: RelevantsLinksLabels = { + RELEVANTS_LINKS_HEADING: 'My Links', +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/relevants-links-label.model.ts b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/relevants-links-label.model.ts new file mode 100644 index 00000000..7569f913 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/relevants-links-label.model.ts @@ -0,0 +1,3 @@ +export interface RelevantsLinksLabels { + RELEVANTS_LINKS_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/relevants-links-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/relevants-links-spanish-labels.const.ts new file mode 100644 index 00000000..7fd7feb8 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/labels/relevants-links-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { RelevantsLinksLabels } from './relevants-links-label.model'; + +export const spanishRelevantsLinksLabels: RelevantsLinksLabels = { + RELEVANTS_LINKS_HEADING: 'Mis enlaces', +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/relevants-links-section.ejs b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/relevants-links-section.ejs new file mode 100644 index 00000000..ec64bf86 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/relevants-links-section.ejs @@ -0,0 +1,125 @@ +<%_ if (profile.relevantLinks && profile.relevantLinks.length !== 0) { -%> +
+

<%- labels.RELEVANTS_LINKS_HEADING %>

+
+ <%_ for (const link of profile?.relevantLinks) { -%> + <%_ if (link.type === 'linkedin') { -%> +
+ + + + + + + + + + + target="_blank">Linkedin +
+ <%_ } -%> + <%_ if (link.type === 'github') { -%> +
+ + + + + + + + + + + target="_blank">GitHub +
+ <%_ } %> + <%_ if (link.type === 'twitter') { -%> +
+ + + + target="_blank">Twitter +
+ <%_ } %> + <%_ if (link.type === 'web') { -%> +
+ + + + target="_blank">Web +
+ <%_ } %> + <%_ if (link.type === 'otros') { -%> +
+ + + + + + + target="_blank">Otros +
+ <%_ } %> + <%_ } %> +
+
+<%_ } -%> + diff --git a/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/relevants-links-section.part.ts b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/relevants-links-section.part.ts new file mode 100644 index 00000000..40f1f94c --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/relevants-links-section/relevants-links-section.part.ts @@ -0,0 +1,24 @@ +import ejs from 'ejs'; +import { ProfileSectionVm, mapFromMacCvToProfileSectionVm } from '@lemoncode/manfred-common/profile-section'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { ManfredAwesomicCV, Settings, Language } from '@/model'; +import { getLabels } from './labels'; +import relevantsLinksSection from './relevants-links-section.ejs?raw'; + +export const generateRelevantsLinksSection = (cv: ManfredAwesomicCV, settings: Settings): string => { + const profileSectionVm = mapFromMacCvToProfileSectionVm(cv); + + return generateRelevantsLinksSectionInner(profileSectionVm, settings.language); +}; + +const generateRelevantsLinksSectionInner = ( + profileSectionVm: ProfileSectionVm, + language: Language = ISO_SPANISH_LANGUAGE +): string => { + const rootObject = { + profile: profileSectionVm, + labels: getLabels(language), + }; + + return ejs.render(relevantsLinksSection, rootObject); +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/index.ts new file mode 100644 index 00000000..caf64397 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/index.ts @@ -0,0 +1 @@ +export * from './soft-skills-section.part'; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/index.ts new file mode 100644 index 00000000..9529c12a --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { SoftSkillsLabels } from './soft-skills-label.model'; +import { spanishSoftSkillsLabels } from './soft-skills-spanish-labels.const'; +import { englishSoftSkillsLabels } from './soft-skills-english-labels.const'; + +export const getLabels = (language: Language): SoftSkillsLabels => { + switch (language) { + case 'es': + return spanishSoftSkillsLabels; + case 'en': + return englishSoftSkillsLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/soft-skills-english-labels.const.ts b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/soft-skills-english-labels.const.ts new file mode 100644 index 00000000..d2510c35 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/soft-skills-english-labels.const.ts @@ -0,0 +1,5 @@ +import { SoftSkillsLabels } from './soft-skills-label.model'; + +export const englishSoftSkillsLabels: SoftSkillsLabels = { + SOFT_SKILLS_HEADING: 'Soft skills', +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/soft-skills-label.model.ts b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/soft-skills-label.model.ts new file mode 100644 index 00000000..602ec990 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/soft-skills-label.model.ts @@ -0,0 +1,3 @@ +export interface SoftSkillsLabels { + SOFT_SKILLS_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/soft-skills-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/soft-skills-spanish-labels.const.ts new file mode 100644 index 00000000..446d1fe1 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/labels/soft-skills-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { SoftSkillsLabels } from './soft-skills-label.model'; + +export const spanishSoftSkillsLabels: SoftSkillsLabels = { + SOFT_SKILLS_HEADING: 'Habilidades', +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/soft-skills-section.ejs b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/soft-skills-section.ejs new file mode 100644 index 00000000..2cb15bb5 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/soft-skills-section.ejs @@ -0,0 +1,10 @@ +<%_ if (softSkillsCollection && softSkillsCollection.length !== 0) { -%> +
+

<%- labels.SOFT_SKILLS_HEADING %>

+
    + <%_ for (const item of softSkillsCollection) { -%> +
  • <%- item.skill.name %>
    • + <%_ } -%> +
+
+ <%_ } -%> diff --git a/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/soft-skills-section.part.ts b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/soft-skills-section.part.ts new file mode 100644 index 00000000..7ff3a03a --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/soft-skills-section/soft-skills-section.part.ts @@ -0,0 +1,22 @@ +import ejs from 'ejs'; +import { SoftSkillVM, mapFromCvToSoftSkillVm } from '@lemoncode/manfred-common/soft-skill-section'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { Settings, Language, ManfredAwesomicCV } from '@/model'; +import { getLabels } from './labels'; +import softSkillsSection from './soft-skills-section.ejs?raw'; + +export const generateSoftSkillsSection = (cv: ManfredAwesomicCV, settings: Settings): string => { + const softSkillsSectionVm = mapFromCvToSoftSkillVm(cv); + return generateSoftSkillsSectionInner(softSkillsSectionVm, settings.language); +}; + +const generateSoftSkillsSectionInner = ( + softSkillsSectionVm: SoftSkillVM[], + language: Language = ISO_SPANISH_LANGUAGE +): string => { + const rootObject = { + softSkillsCollection: softSkillsSectionVm, + labels: getLabels(language), + }; + return ejs.render(softSkillsSection, rootObject); +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/studies-section/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/index.ts new file mode 100644 index 00000000..bd83d5eb --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/index.ts @@ -0,0 +1 @@ +export * from './studies-section.part'; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/index.ts b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/index.ts new file mode 100644 index 00000000..d0f8daeb --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/index.ts @@ -0,0 +1,15 @@ +import { Language } from '@/model'; +import { StudiesLabels } from './studies-label.model'; +import { spanishStudiesLabels } from './studies-spanish-labels.const'; +import { englishStudiesLabels } from './studies-english-labels.const'; + +export const getLabels = (language: Language): StudiesLabels => { + switch (language) { + case 'es': + return spanishStudiesLabels; + case 'en': + return englishStudiesLabels; + default: + throw new Error(`Language not supported: ${language}`); + } +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/studies-english-labels.const.ts b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/studies-english-labels.const.ts new file mode 100644 index 00000000..e57fc9f9 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/studies-english-labels.const.ts @@ -0,0 +1,5 @@ +import { StudiesLabels } from './studies-label.model'; + +export const englishStudiesLabels: StudiesLabels = { + STUDIES_HEADING: 'Studies', +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/studies-label.model.ts b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/studies-label.model.ts new file mode 100644 index 00000000..27d0cf19 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/studies-label.model.ts @@ -0,0 +1,3 @@ +export interface StudiesLabels { + STUDIES_HEADING: string; +} diff --git a/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/studies-spanish-labels.const.ts b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/studies-spanish-labels.const.ts new file mode 100644 index 00000000..0c35087e --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/labels/studies-spanish-labels.const.ts @@ -0,0 +1,5 @@ +import { StudiesLabels } from './studies-label.model'; + +export const spanishStudiesLabels: StudiesLabels = { + STUDIES_HEADING: 'Estudios', +}; diff --git a/packages/manfred2html/src/engine/template-b/html-parts/studies-section/studies-section.ejs b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/studies-section.ejs new file mode 100644 index 00000000..b3dcaaa0 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/studies-section.ejs @@ -0,0 +1,68 @@ +<%_ if (studiesCollection && studiesCollection.length !== 0) { -%> +
+
+

<%- labels.STUDIES_HEADING %>

+
+
+ <%_ for (const study of studiesCollection) { -%> +
+
+ + + +
+
+

<%- study.name %>

+ <%_ if (study.description) { -%> +

<%- study.description %>

+ <%_ } -%> +
+ + + +

<%- new Date(study.startDate).toLocaleDateString(undefined, { year:"numeric", month:"short"})%> <%_ if(study.finishDate && study.finishDate.toLowerCase() !=='actualidad') { -%> + <%- "- "+new Date(study.finishDate).toLocaleDateString(undefined, { year:"numeric", month:"short"}) -%> + <%_ } else { -%> + - Actualidad + <%_}-%> +

+
+

Tipo de estudios: <%- study.studyType %>

+

+ Grado obtenido: <% if (study.degreeAchieved) { %> + Obtenido + <%} else { %> + No obtenido + <% } %> +

+

Nombre de la institución: <%- study.institution.name %>

+ <%_ if (study.location) { -%> +

+ Ubicación de la institución: + <%- study.institution.location.region %> , <%- study.institution.location.country %> +

+ <%_ } -%> +
+
+ <%_ } -%> +
+ <%_ } -%> diff --git a/packages/manfred2html/src/engine/template-b/html-parts/studies-section/studies-section.part.ts b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/studies-section.part.ts new file mode 100644 index 00000000..ce48aa57 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/html-parts/studies-section/studies-section.part.ts @@ -0,0 +1,24 @@ +import ejs from 'ejs'; +import { StudiesSectionVm, mapFromMacCvToStudiesSectionVm } from '@lemoncode/manfred-common/studies-section'; +import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const'; +import { ManfredAwesomicCV, Settings, Language } from '@/model'; +import { getLabels } from './labels'; +import studiesTemplate from './studies-section.ejs?raw'; + +export const generateStudiesSection = (cv: ManfredAwesomicCV, settings: Settings): string => { + const studiesSectionVm = mapFromMacCvToStudiesSectionVm(cv); + + return generateStudiesSectionInner(studiesSectionVm, settings.language); +}; + +const generateStudiesSectionInner = ( + studiesSectionVm: StudiesSectionVm[], + language: Language = ISO_SPANISH_LANGUAGE +): string => { + const rootObject = { + studiesCollection: studiesSectionVm, + labels: getLabels(language), + }; + + return ejs.render(studiesTemplate, rootObject); +}; diff --git a/packages/manfred2html/src/engine/template-b/index.ts b/packages/manfred2html/src/engine/template-b/index.ts new file mode 100644 index 00000000..efcb6918 --- /dev/null +++ b/packages/manfred2html/src/engine/template-b/index.ts @@ -0,0 +1,56 @@ +import { ManfredAwesomicCV, Settings } from '@/model'; +import { + generateHtmlDocumentStart, + generateHtmlDocumentEnd, + generateHeaderElementStart, + generateHeaderElementEnd, + generateHeaderSection, + generateAsideElementStart, + generateAsideElementEnd, + generateMainElementStart, + generateMainElementEnd, + generateRelevantsLinksSection, + generateLanguageSection, + generateHardSkillsSection, + generateSoftSkillsSection, + generateAboutMeSection, + generateExperiencesSection, + generateStudiesSection, +} from './html-parts'; + +export const exportManfredJSonToHTMLTemplateB = (manfredJsonContent: ManfredAwesomicCV, settings: Settings): string => { + const htmlDocumentStart = generateHtmlDocumentStart(settings.colorTheme); + const htmlDocumentEnd = generateHtmlDocumentEnd(); + const headerElementStart = generateHeaderElementStart(); + const headerElementEnd = generateHeaderElementEnd(); + const headerSection = generateHeaderSection(manfredJsonContent); + const relevantsLinksSection = generateRelevantsLinksSection(manfredJsonContent, settings); + const hardSkillsSection = generateHardSkillsSection(manfredJsonContent, settings); + const softSkillsSection = generateSoftSkillsSection(manfredJsonContent, settings); + const languageSection = generateLanguageSection(manfredJsonContent, settings); + const asideElementStart = generateAsideElementStart(); + const asideElementEnd = generateAsideElementEnd(); + const mainElementStart = generateMainElementStart(); + const mainElementEnd = generateMainElementEnd(); + const aboutMeSection = generateAboutMeSection(manfredJsonContent, settings); + const experienceSection = generateExperiencesSection(manfredJsonContent, settings); + const studiesSection = generateStudiesSection(manfredJsonContent, settings); + return ` + ${htmlDocumentStart} + ${asideElementStart} + ${headerElementStart} + ${headerSection} + ${headerElementEnd} + ${relevantsLinksSection} + ${languageSection} + ${hardSkillsSection} + ${softSkillsSection} + ${asideElementEnd} + ${mainElementStart} + ${aboutMeSection} + ${experienceSection} + ${studiesSection} + ${mainElementEnd} + ${htmlDocumentEnd} + `; +}; diff --git a/packages/manfred2html/src/index.ts b/packages/manfred2html/src/index.ts index 18539350..2f7c68aa 100644 --- a/packages/manfred2html/src/index.ts +++ b/packages/manfred2html/src/index.ts @@ -1,2 +1,3 @@ export * from '@/engine'; export * from '@/model'; +export * from '@/mappers'; diff --git a/packages/manfred2html/src/mappers/exportHTMLSettings.mappers.ts b/packages/manfred2html/src/mappers/exportHTMLSettings.mappers.ts new file mode 100644 index 00000000..6ba8989d --- /dev/null +++ b/packages/manfred2html/src/mappers/exportHTMLSettings.mappers.ts @@ -0,0 +1,26 @@ +import { ColorTheme, ExportHTMLSettings, Settings, HexColor } from '@/model'; + +export const mapColorThemeToHex = (colorTheme: ColorTheme): HexColor => { + switch (colorTheme) { + case 'default': + return HexColor.default; + case 'red': + return HexColor.red; + case 'green': + return HexColor.green; + case 'orange': + return HexColor.orange; + case 'yellow': + return HexColor.yellow; + case 'dark': + return HexColor.dark; + default: + return HexColor.default; + } +}; + +export const mapExportHTMLSettingsToSettings = (exportHTMLSettings: ExportHTMLSettings): Settings => ({ + colorTheme: mapColorThemeToHex(exportHTMLSettings.colorTheme), + template: exportHTMLSettings.template || 'default', + language: exportHTMLSettings.language || 'es', +}); diff --git a/packages/manfred2html/src/mappers/index.ts b/packages/manfred2html/src/mappers/index.ts new file mode 100644 index 00000000..00e00995 --- /dev/null +++ b/packages/manfred2html/src/mappers/index.ts @@ -0,0 +1 @@ +export * from './exportHTMLSettings.mappers'; diff --git a/packages/manfred2html/src/model/export-html-settings.model.ts b/packages/manfred2html/src/model/export-html-settings.model.ts index 88f8deda..9d84cc80 100644 --- a/packages/manfred2html/src/model/export-html-settings.model.ts +++ b/packages/manfred2html/src/model/export-html-settings.model.ts @@ -1,4 +1,38 @@ +export type ColorTheme = 'default' | 'red' | 'green' | 'orange' | 'yellow' | 'dark'; +export type TemplateCV = + | 'Moderno elegante' + | 'Limpio y organizado' + | 'Clásico' + | 'Minimalista' + | 'Artístico' + | 'Tecnológico' + | 'Creativo' + | 'Profesional' + | 'Elegante'; +export type Language = 'es' | 'en'; +export enum HexColor { + default = '#247A7E', + red = '#E61934', + green = '#1DB155', + orange = '#CD562F', + yellow = '#DEBC19', + dark = '#1B2B33', +} + export interface ExportHTMLSettings { - primaryColor: string; - // TODO: More settings to be added here + colorTheme: ColorTheme; + template: TemplateCV; + language: Language; +} + +export interface Settings { + colorTheme: HexColor; + template: TemplateCV; + language: Language; } + +export const createDefaultExportHTMLSettings = (): ExportHTMLSettings => ({ + colorTheme: 'default', + template: 'Moderno elegante', + language: 'es', +});