✨(project) first proof of concept printing pdf from markdown

This is a boilerplate inspired from https://github.com/openfun/joanie

src/mail/mjml/hello.mjml

@@ -0,0 +1,28 @@
+<mjml>
+  <mj-include path="./partial/header.mjml" />
+  <mj-body mj-class="bg--blue-100">
+    <mj-wrapper css-class="wrapper" padding="20px 40px 40px 40px">
+    <mj-section>
+      <mj-column>
+        <mj-image src="{% base64_static 'publish/images/logo_publish.png' %}" width="200px" align="left" alt="{%trans 'Company logo' %}" />
+      </mj-column>
+    </mj-section>
+      <mj-section mj-class="bg--blue-100" border-radius="6px 6px 0 0" padding="30px 50px 60px 50px">
+        <mj-column>
+          <mj-text padding="0">
+            <p>
+              {%if fullname%}
+                {% blocktranslate with name=fullname %}Hello {{ name }}{% endblocktranslate %}
+              {% else %}
+                {%trans "Hello" %}
+              {% endif %}<br/>
+              <strong>{%trans "Thank you very much for your visit!"%}</strong>
+            </p>
+          </mj-text>
+        </mj-column>
+      </mj-section>
+    </mj-wrapper>
+    <mj-include path="./partial/footer.mjml" />
+  </mj-body>
+</mjml>
+

src/mail/mjml/partial/footer.mjml

@@ -0,0 +1,9 @@
+<mj-section padding="0">
+  <mj-column>
+    <mj-text mj-class="text--small" align="center" padding="20px 20px">
+      {% blocktranslate with href=site.url name=site.name trimmed %}
+        This mail has been sent to {{email}} by <a href="{{href}}">{{name}}</a>
+      {% endblocktranslate %}
+    </mj-text>
+  </mj-column>
+</mj-section>

src/mail/mjml/partial/header.mjml

@@ -0,0 +1,48 @@
+<mj-head>
+    <mj-title>{{ title }}</mj-title>
+    <mj-preview>
+        <!--
+            We load django tags here, in this way there are put within the body in html output
+            so the html-to-text command includes it within its output
+        -->
+        {% load i18n static extra_tags %}
+        {{ title }}
+    </mj-preview>
+    <mj-attributes>
+        <mj-font name="Roboto" href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700;900&display=swap" />
+        <mj-all
+                font-family="Roboto, -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif"
+                font-size="16px"
+                line-height="1.5em"
+                color="#031963"
+        />
+        <mj-class name="text--small" font-size="0.875rem" />
+        <mj-class name="bg--blue-100" background-color="#EDF5FA" />
+    </mj-attributes>
+    <mj-style>
+        /* Reset */
+        h1, h2, h3, h4, h5, h6, p {
+            margin: 0;
+            padding: 0;
+        }
+
+        a {
+            color: inherit;
+        }
+    </mj-style>
+    <mj-style>
+        /* Global styles */
+        h1 {
+            color: #055FD2;
+            font-size: 2rem;
+            line-height: 1em;
+            font-weight: 700;
+        }
+
+        .wrapper {
+            background: #FFFFFF;
+            border-radius: 0 0 6px 6px;
+            box-shadow: 0 0 6px rgba(2 117 180 / 0.3);
+        }
+    </mj-style>
+</mj-head>