Feature/#325 cv monochrome force use mapper markdown to html and update styles

export-samples/html/cv-monochrome-force.html

@@ -337,6 +337,9 @@
       }
 
       /* section about */
+      .about__text * + * {
+        margin-top: var(--space-8);
+      }
       @media screen and (min-width: 834px) {
         .about {
           font-size: var(--fs-l);
@@ -519,6 +522,13 @@
       .experience__text {
         font-weight: var(--fw-light);
       }
+      .experience__text ul,
+      .experience__text ol {
+        padding-left: var(--space-24);
+      }
+      .experience__text * + * {
+        margin-top: var(--space-base);
+      }
       .experience__url {
         display: block;
         font-size: var(--fs-xs);
@@ -533,6 +543,7 @@
         font-weight: var(--fw-medium);
         color: var(--primary-600);
         margin-bottom: var(--space-16);
+        margin-top: var(--space-base);
       }
       .experience__tools-list {
         padding: 0;
@@ -813,18 +824,20 @@ <h2 class="title">Mis Enlaces</h2>
       </section>
       <section class="section about">
         <h2 class="title">Sobre mi</h2>
-        <p>
-          Llevo casi dos décadas desarrollando software, ocupando puestos a lo largo de toda la cadena de valor
-          -programacion, diseño de producto, marketing, ventas y gestión de equipos, departamentos y empresas- pero creo
-          que el rol donde se cruzan mi vocación, mis habilidades y las necesidades de la mayoría de las empresas es en
-          la gestión de equipos y proyectos de construcción de activos digitales. Me apasiona contribuir en todo el
-          ciclo de vida de un producto o servicio informático, desde la definición hasta el mantenimiento o soporte a
-          clientes, y también involucrarme en la comercialización del mismo. Me gusta trabajar con gente y para la
-          gente. Como responsable de equipos, mi principal prioridad siempre es eliminar cualquier problema que les
-          impida alcanzar todo su potencial. También procuro devolver a la Comunidad informática parte del valor y el
-          conocimiento que me han aportado a lo largo de mi carrera profesional, dando charlas o colaborando con grupos
-          de usuarios y conferencias técnicas; y, a veces, organizándolos.
-        </p>
+        <div class="about__text">
+          <p>
+            Llevo casi dos décadas desarrollando software, ocupando puestos a lo largo de toda la cadena de valor
+            -programacion, diseño de producto, marketing, ventas y gestión de equipos, departamentos y empresas- pero
+            creo que el rol donde se cruzan mi vocación, mis habilidades y las necesidades de la mayoría de las empresas
+            es en la gestión de equipos y proyectos de construcción de activos digitales. Me apasiona contribuir en todo
+            el ciclo de vida de un producto o servicio informático, desde la definición hasta el mantenimiento o soporte
+            a clientes, y también involucrarme en la comercialización del mismo. Me gusta trabajar con gente y para la
+            gente. Como responsable de equipos, mi principal prioridad siempre es eliminar cualquier problema que les
+            impida alcanzar todo su potencial. También procuro devolver a la Comunidad informática parte del valor y el
+            conocimiento que me han aportado a lo largo de mi carrera profesional, dando charlas o colaborando con
+            grupos de usuarios y conferencias técnicas; y, a veces, organizándolos.
+          </p>
+        </div>
       </section>
       <section class="section hard-skills">
         <h2 class="title">Habilidades</h2>

packages/manfred2html/src/engine/cv-monochrome-force/html-parts/about-me-section/about-me-section.ejs

@@ -1,6 +1,6 @@
 <%_ if (profile.description && profile.description !== 'undefined' ) { -%>
     <section class="section about">
         <h2 class="title"><%- labels.ABOUT_ME_HEADING %></h2>
-        <p><%= profile.description %></p>
+        <div class="about__text"><%- mapMarkdownToHTML(profile.description) %></div>
     </section>
 <%_ } -%>

packages/manfred2html/src/engine/cv-monochrome-force/html-parts/about-me-section/about-me-section.part.ts

@@ -4,6 +4,7 @@ import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const';
 import { ManfredAwesomicCV, Settings, Language } from '@/model';
 import { getLabels } from './labels';
 import aboutMeSection from './about-me-section.ejs?raw';
+import { mapMarkdownToHTML } from '@/mappers';
 
 export const generateAboutMeSection = (cv: ManfredAwesomicCV, settings: Settings): string => {
   const profileSectionVm = mapFromMacCvToProfileSectionVm(cv);
@@ -18,6 +19,7 @@ const generateAboutMeSectionInner = (
   const rootObject = {
     profile: profileSectionVm,
     labels: getLabels(language),
+    mapMarkdownToHTML,
   };
   return ejs.render(aboutMeSection, rootObject);
 };

packages/manfred2html/src/engine/cv-monochrome-force/html-parts/experience-section/experience-section.ejs

@@ -16,7 +16,7 @@
         <%_ if(experience.roles[0].challenges && experience.roles[0].challenges.length !== 0) { -%>
         <div class="experience__text">
           <%_ for(const challenge of experience.roles[0].challenges){ -%>
-          <p><%- challenge.description %></p>
+          <%- mapMarkdownToHTML(challenge.description) %>
           <%_}-%>
         </div>
         <%_}-%>

packages/manfred2html/src/engine/cv-monochrome-force/html-parts/experience-section/experience-section.part.ts

@@ -4,6 +4,7 @@ import { Settings, Language, ManfredAwesomicCV } from '@/model';
 import { ISO_SPANISH_LANGUAGE } from '@/engine/engine.const';
 import experienceTemplate from './experience-section.ejs?raw';
 import { getLabels } from './labels';
+import { mapMarkdownToHTML } from '@/mappers';
 
 export const generateExperiencesSection = (cv: ManfredAwesomicCV, settings: Settings): string => {
   const experienceSectionVm = mapFromMacCvToExperienceSectionVm(cv);
@@ -18,6 +19,7 @@ const generateExperienceSectionInner = (
   const rootObject = {
     experienceCollection: experienceSectionVm,
     labels: getLabels(language),
+    mapMarkdownToHTML,
   };
 
   return ejs.render(experienceTemplate, rootObject);

packages/manfred2html/src/engine/cv-monochrome-force/html-parts/html-document-start/html-document-start.ejs

@@ -337,6 +337,9 @@
       }
 
       /* section about */
+      .about__text * + * {
+        margin-top: var(--space-8);
+      }
       @media screen and (min-width: 834px) {
         .about {
           font-size: var(--fs-l);
@@ -519,6 +522,13 @@
       .experience__text {
         font-weight: var(--fw-light);
       }
+      .experience__text ul, .experience__text ol{
+        padding-left: var(--space-24);
+      }
+      .experience__text * + *{
+        margin-top: var(--space-base);
+      }
+
       .experience__url {
         display: block;
         font-size: var(--fs-xs);
@@ -533,6 +543,7 @@
         font-weight: var(--fw-medium);
         color: var(--primary-600);
         margin-bottom: var(--space-16);
+        margin-top: var(--space-base);
       }
       .experience__tools-list {
         padding: 0;