From 51d0c7118a3f53e5e22d11df948e3692c6f15a0d Mon Sep 17 00:00:00 2001
From: bach <bachir@figureslibres.io>
Date: Mon, 2 Oct 2023 12:18:31 +0200
Subject: [PATCH] preserving whitespaces #2199

---
 src/assets/main.scss                     | 78 ++++++++++++------------
 src/components/contents/TerrainDeVie.vue |  6 +-
 vite.config.js                           |  8 ++-
 3 files changed, 51 insertions(+), 41 deletions(-)

diff --git a/src/assets/main.scss b/src/assets/main.scss
index 7ea44b8..80fd726 100644
--- a/src/assets/main.scss
+++ b/src/assets/main.scss
@@ -376,43 +376,43 @@ body{
             // padding:0 0 0 1em;
           }
           
-          .v-select{
-            input.vs__search{
-              display: none;
-            }
-            div.vs__dropdown-toggle{
-              border-radius: 0;
-              border: none;
-            }
-            div.vs__selected-options{
-              padding: 0;
-              span.vs__selected{
-                padding: 0;
-                margin: 0;
-                font-weight: 400;
-                font-size: 1.323em;
-                color:inherit;
-                line-height: 1.15;
-              }
-            }
-            ul.vs__dropdown-menu{
-              border-radius: 0;
-              border: none;
-              li.vs__dropdown-option{
-                white-space:normal;
-                padding:1em 1em 0 1em;
-                &:last-of-type{
-                  padding:1em;
-                }
-                color: #aaa;
-                transition: color 0.2s ease-in-out;
-                &.vs__dropdown-option--highlight{
-                  color:#000;
-                  background-color: #fff;
-                }
-              }
-            }
-          }
+          // .v-select{
+          //   input.vs__search{
+          //     display: none;
+          //   }
+          //   div.vs__dropdown-toggle{
+          //     border-radius: 0;
+          //     border: none;
+          //   }
+          //   div.vs__selected-options{
+          //     padding: 0;
+          //     span.vs__selected{
+          //       padding: 0;
+          //       margin: 0;
+          //       font-weight: 400;
+          //       font-size: 1.323em;
+          //       color:inherit;
+          //       line-height: 1.15;
+          //     }
+          //   }
+          //   ul.vs__dropdown-menu{
+          //     border-radius: 0;
+          //     border: none;
+          //     li.vs__dropdown-option{
+          //       white-space:normal;
+          //       padding:1em 1em 0 1em;
+          //       &:last-of-type{
+          //         padding:1em;
+          //       }
+          //       color: #aaa;
+          //       transition: color 0.2s ease-in-out;
+          //       &.vs__dropdown-option--highlight{
+          //         color:#000;
+          //         background-color: #fff;
+          //       }
+          //     }
+          //   }
+          // }
         }
 
       }
@@ -493,7 +493,9 @@ body{
         padding:0; margin:0;
         list-style: none;
       }
-
+      p{
+        white-space: pre-line;
+      }
      
     }
     section.search{
diff --git a/src/components/contents/TerrainDeVie.vue b/src/components/contents/TerrainDeVie.vue
index 2dad85a..bc3ee14 100644
--- a/src/components/contents/TerrainDeVie.vue
+++ b/src/components/contents/TerrainDeVie.vue
@@ -166,11 +166,13 @@ export default {
       <template v-if="!entite">
         <section v-if="concernement.description" class="description">
             <label v-if="ct_concernement">{{ ct_concernement.field_description.description }}</label>
-            <div v-html="concernement.description"/>
+            <p v-html="concernement.description"/>
+            <!-- <p>{{ concernement.description }}</p> -->
         </section>
         <section v-if="concernement.caillou" class="caillou">
             <label v-if="ct_concernement">{{ ct_concernement.field_caillou.description }}</label>
-            <div v-html="concernement.caillou"/>
+            <!-- <p v-html="concernement.caillou"/> -->
+            <p>{{ concernement.caillou }}</p>
         </section>
       </template>
 
diff --git a/vite.config.js b/vite.config.js
index e22ede7..2a05008 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -8,7 +8,13 @@ import svgLoader from 'vite-svg-loader'
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [vue(), graphql(), viteRequire(), svgLoader({defaultImport: 'raw'})],
+  plugins: [vue({
+      template: {
+        compilerOptions: {
+          whitespace: 'preserve'
+        }
+      }
+    }), graphql(), viteRequire(), svgLoader({defaultImport: 'raw'})],
   resolve: {
     alias: {
       '@': fileURLToPath(new URL('./src', import.meta.url)),