Update pdf template and styles

src/_includes/partials/components/pdf/section.liquid

@@ -1,31 +1,80 @@
-<section>
+{% assign showTitle = true %}
-    {% if section.data.showTitle != false %}
+{% if section.data.showTitle == true or section.data.showTitle == false %}
-        <div class="title">
+    {% assign showTitle = section.data.showTitle %}
-            <h2>
-                {% if section.data.displayedTitle %}
-                    {{ section.data.displayedTitle }}
-                {% else %}
-                    {{ section.data.title }}
 {% endif %}
-            </h2>
+{% if section.data.pdf.showTitle == true or section.data.pdf.showTitle == false %}
+    {% assign showTitle = section.data.pdf.showTitle %}
+{% endif %}
+
+{% assign title = section.data.title %}
+{% if section.data.pdf.title %}
+    {% assign title = section.data.pdf.title %}
+{% endif %}
+<section>
+    {% if showTitle %}
+        <div class="title">
+            <h2>{{ title }}</h2>
             <hr>
         </div>
     {% endif %}
 
+    {% if items %}
         {% for item in items %}
             <div class="subtitle">
-            <h3>{{ item.data.title }}</h3>
+                <h4>{{ item.data.title }}</h4>
+                {% if item.data.role %}
                     <p class="underline">
                         <strong>{{ item.data.role }}</strong>
                     </p>
+                {% else %}
+                    <span></span>
+                {% endif %}
                 {% if item.data.dates %}
                     <div class="timeSection">
                         <span>{{ item.data.location }}</span>
                         <strong>{{ item.data.dates.start }} - {{ item.data.dates.end }}</strong>
                     </div>
                 {% endif %}
+                {% if item.data.links %}
+                    <ul class="list-inline">
+
+                        {% for link in item.data.links %}
+                            {% assign linkHref = link %}
+                            {% if link.link %}
+                                {% assign linkHref = link.link %}
+                            {% endif %}
+
+                            {% assign linkTitle = "Voir sur " | append: linkHref %}
+                            {% if linkHref contains "codeberg.org" or linkHref contains "github.com" %}
+                                {% assign linkTitle = "Source" %}
+                            {% endif %}
+
+                            {% if linkHref contains "npmjs.com" %}
+                                {% assign linkTitle = "Demo" %}
+                            {% endif %}
+
+                            {% if link.title %}
+                                {% assign linkTitle = link.title %}
+                            {% endif %}
+
+                            <li>
+                                {% link linkHref, "_blank" %}{{ linkTitle }}{% endlink %}
+                            </li>
+                        {% endfor %}
+                    </ul>
+
+                {% endif %}
             </div>
     
             {{ item.templateContent }}
         {% endfor %}
+    {% else %}
+        <ul>
+            <li><strong>Compétences techniques</strong>: {{ author.skills | join: ", " }}</li>
+            <li><strong>Langues</strong>: {{ author.lang | join: ", " }}</li>
+            <li><strong>Autre</strong>: {{ author.other | join: ", " }}</li>
+        </ul>
+    {% endif %}
+
+    
 </section>

src/css/pdf.css

@@ -1,11 +1,10 @@
 :root {
-  --accent-color: blue;
+  --accent-color: #1155CC;
-  --font-body: Arial, sans-serif;
+  --font-body: Helvetica, Arial, sans-serif;
-  --font-display: 'Times New Roman', Times, serif;
 }
 
 html {
-  font-family: var(--font-body, Arial, sans-serif);
+  font-family: var(--font-body, Helvetica, Arial, sans-serif);
   margin: 0;
 }
 body {
@@ -20,13 +19,12 @@ body {
 
 h1 {
   text-align: center;
-  font-family: var(--font-display, 'Times New Roman', Times, serif);
+  font-size: 1.8rem;
-  font-size: 2rem;
   margin: 0;
   line-height: 1.6;
 }
 h2 {
-  color : var(--accent-color, blue);
+  color : var(--accent-color, #1155CC);
 }
 p {
   margin: 0;
@@ -37,6 +35,7 @@ ul {
 li::marker {
   color: var(--accent-color, blue);
 }
+a { color : var(--accent-color, #1155CC); }
 section {margin-bottom: 1.2rem;}
 
 .justify-center {
@@ -56,7 +55,7 @@ section {margin-bottom: 1.2rem;}
   display: contents;
 }
 .list-inline li + li::before {
-  content: '|';
+  content: var(--item-separator, '|');
 }
 
 .title {
@@ -82,9 +81,12 @@ section ul {padding: 0;margin-left: 1.2rem;}
   margin-inline: 1rem;
   margin-bottom: .4rem;
 }
+.subtitle .list-inline { --item-separator: "•"; gap: .4rem; }
 .subtitle .timeSection { font-size: .9rem; }
 .subtitle h3,
+.subtitle h4,
 .subtitle p { margin: 0; }
+.subtitle a { font-size: .9em; }
 .subtitle > :first-child {justify-self: start;}
 .subtitle > :last-child {justify-self: end;}
 .subtitle ~ ul {font-size: .9rem;}