🚸 add margins to titles

src/app.ts

@@ -11,7 +11,7 @@ export default defineApp({
       link: [
         {
           rel: "stylesheet",
-          href: "https://fonts.googleapis.com/css2?family=Playfair+Display&family=Meow+Script&family=Oxygen+Mono&display=swap",
+          href: "https://fonts.googleapis.com/css2?family=Noto+Serif+Display&family=Meow+Script&family=Oxygen+Mono&display=swap",
         },
       ],
     }

src/assets/base.scss

@@ -74,8 +74,8 @@ body {
   color: var(--color-text);
   background: var(--color-background);
   transition: color 0.5s, background-color 0.5s;
-  font-family: 'Playfair Display', serif;
-  font-size: 18px;
+  font-family: 'Noto Serif', serif;
+  font-size: 20px;
   line-height: 1.6rem;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
@@ -104,6 +104,15 @@ h4,
 h5,
 h6 {
   color: var(--primary);
+  padding-bottom: 0.5rem;
+}
+
+h2,
+h3,
+h4,
+h5,
+h6 {
+  margin-top: 1rem;
 }
 
 h1 {

src/components/Welcome.vue

@@ -10,10 +10,7 @@
 
     <h3>My books</h3>
 
-    <p>
-      I'm glad to share you <a href="/my-books">the books</a> I'm currently reading.
-    </p>
-
+    <p><a href="/my-books">The books</a> I'm currently reading.</p>
   </section>
 </template>
 

src/components/posts/blog-posts.vue

@@ -1,14 +1,16 @@
 <script setup lang="ts">
-import { usePosts } from "@/hooks/usePosts.hook";
+import { usePosts } from "@/hooks/usePosts.hook"
 
-const posts = usePosts();
+const posts = usePosts()
 </script>
 
 <template>
   <div class="blog-posts">
     <h2>Last posts</h2>
-    <h3 v-for="post in posts" :key="post.href">
-      - <a :href="post.href">{{ post.title }}</a>
-    </h3>
+    <ul>
+      <li v-for="post in posts" :key="post.href">
+        <a :href="post.href">{{ post.title }}</a>
+      </li>
+    </ul>
   </div>
 </template>

src/components/presentation/about-me.vue

@@ -2,7 +2,8 @@
 
 <template>
   <h1>
-    Hi! I'm <julien-calixte version="compact" />. A mobile & web developer.
+    Hi! I'm <julien-calixte version="compact" />. An Engineer Manager and web
+    developer.
   </h1>
   <section class="about-me">
     <p>I am into building things with code.</p>

src/pages/posts/feature-flow.mdx

@@ -1,11 +1,11 @@
 ---
-title: An introduction to the feature factory
+title: An introduction to the feature flow
 layout: post
 date: 2022-11-19
 draft: true
 ---
 
-# An introduction to the feature factory
+# An introduction to the feature flow
 
 From my experience, project failures mainly come from having mistrust between teams. Therefor lead time due to team availability to solve dependencies increases.
 
@@ -13,7 +13,7 @@ A kanban is a way to illustrate the needed interactions between teams to complet
 
 In this post, I would like to tell you what helped me, how we succeed to engage all the skills needed to develop a product. We'll talk about agility, about lean, about problems.
 
-## Creating a visual feature flow
+## Creating flow
 
 ### Define the steps
 
@@ -38,7 +38,7 @@ You may answer "Easy! There are few steps:"
 
 But how exactly? What does "talking to the client" really mean? And "coding" ?
 
-In lean, one particular important concept is **Visual Management**: *doing by seeing*. For that, we want to be clear on how we work.
+In lean, one particular important concept is **Visual Management**: _doing by seeing_. For that, we want to be clear on how we work.
 
 May I ask you some questions?