maj readme + fetching useFetch

App.vue

@@ -1,11 +1,11 @@
 <template>
   <img id="banner-media" src="/images/header-banalites.jpg"/>
   <header>
-    <CPMMenu :items="contents.sections"/>
+     <CPMMenu :items="contents.sections"/>
   </header>
 
   <main>
-    <section v-for="section in innerSections" v-html="section.content">
+    <section v-for="section in contents.sections.filter((s) => s.content)" v-html="section.content">
     </section>
   </main>
 
@@ -14,8 +14,7 @@
 
 <script setup>
 
-    const contents = await $fetch('/api/contents');
-    const innerSections = contents.sections.filter((item) => item.content);
+    const {data : contents } = await useFetch('/api/contents');
 
 </script>
 
@@ -38,6 +37,8 @@
 
     section {
       margin-top: 50px;
+      font-size: 1.2rem;
+      line-height: 175%;
 
       h1 {
         font-size : 1.5rem;
@@ -47,6 +48,14 @@
         font-size : 1.3rem;
       }
 
+      ul {
+        margin-left: 50px;
+        margin-top: 25px;
+        list-style-type: square;
+      }
+
+      sup { vertical-align: top; position: relative; top: -0.5em; }
+
       figure {
         margin-bottom : 25px;
         img {

README.md

@@ -1,51 +1,29 @@
-# Notes de dev
+# Notes
 les contenus HTML sont récupérés auprès de l'API (dossier server/api) :
 Le fichier contents.ts décrit les sections dans un objet js, récupère les contenus dans les fichiers html du même dossier et retourne cet objet
 pour qu'il soit consommé par la partie cliente.
 
-Un simple 'yarn generate' devrait générer le site statique. Ça fonctionne presque, mais ça la version générée exécute quand même les appels sur /api...
-
-
-
-# Nuxt 3 Minimal Starter
-
-Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
-
-## Setup
-
-Make sure to install the dependencies:
+#  Installation des dép.
 
 ```bash
-# yarn
 yarn install
-
-# npm
-npm install
-
-# pnpm
-pnpm install --shamefully-hoist
 ```
 
-## Development Server
 
-Start the development server on http://localhost:3000
+# Mode dev & hot reload
 
 ```bash
-npm run dev
+yarn dev
 ```
 
-## Production
-
-Build the application for production:
-
+# Génération statique
 ```bash
-npm run build
+yarn generate
 ```
 
-Locally preview production build:
-
+# Preview
 ```bash
-npm run preview
+yarn preview
 ```
 
-Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
+

server/api/artworks.html

@@ -4,21 +4,21 @@
     <div>
         <figure>
             <img src="images/artworks/artwork-cassidy-punch-machine.jpg"/>
-            <figcaption>Dylan Monin x 2017 x 3D</figcaption>
+            <figcaption>Dylan Monin – 2017 – 3D</figcaption>
         </figure>
     </div>
 
     <div>
         <figure>
             <img src="images/artworks/cover-heisenberg.jpg"/>
-            <figcaption>Alexis Lomoff x 2017 x Feutres</figcaption>
+            <figcaption>Alexis Lomoff – 2017 – Feutres</figcaption>
         </figure>
     </div>
 
     <div>
         <figure>
             <img src="images/artworks/bartleby.jpg"/>
-            <figcaption>Dylan Monin x 2020x 3D</figcaption>
+            <figcaption>Dylan Monin – 2020 – 3D</figcaption>
         </figure>
     </div>
 </section>