Reorganize files

.gitignore

@@ -27,11 +27,10 @@ logs
 .env.*
 !.env.example
 
-# zip files
+# Zip files
 static/data/*.zip
-
 # Zip Extracted files
 # data json
 src/assets/data.json
 # assets pictures
-assets/pictures
+public/data/pictures

assets/scss/layout.scss

@@ -1,8 +1,3 @@
-html {
-    background: url('~/static/assets/images/background.png') no-repeat 0 0 scroll;
-    background-size: 100% 100%;
-}
-
 body {
     min-height: 100vh;
     background-color: unset;

components/layout/AppHeader.vue

@@ -10,7 +10,7 @@
           data-bs-placement="bottom"
           :title="settings.title"
         >
-          <img src="assets/layout/ldc-intl.png" alt="Logo LDC" class="img-fluid main-logo">
+          <img src="assets/pictures/layout/ldc-intl.png" alt="Logo LDC" class="img-fluid main-logo">
         </NuxtLink>
       </div>
 

electron/UnzipData.ts

@@ -43,12 +43,12 @@ export default abstract class UnzipData {
 
         const zip = new AdmZip(fs.readFileSync(UnzipData.zipFileToUse));
         // * Clear export dir
-        fs.rmSync(path.resolve(__dirname, "../assets/pictures"), { recursive: true, force: true });
-        fs.rmSync(path.resolve(__dirname, "../assets/data.json"), { recursive: true, force: true });
-        zip.extractAllTo("assets");
+        fs.rmSync(path.resolve(__dirname, "../public/data/pictures"), { recursive: true, force: true });
+        fs.rmSync(path.resolve(__dirname, "../src/assets/data.json"), { recursive: true, force: true });
+        zip.extractAllTo("public/data");
         // * Move data to src assets
         fs.renameSync(
-            path.resolve(__dirname, "../assets/data.json"),
+            path.resolve(__dirname, "../public/data/data.json"),
             path.resolve(__dirname, "../src/assets/data.json")
         );
         const jsonData = fs.readFileSync(

nuxt.config.ts

@@ -49,7 +49,7 @@ export default defineNuxtConfig({
     },
 
     // Global CSS: https://go.nuxtjs.dev/config-css
-    css: ["~/static/scss/style.scss"],
+    css: ["~/assets/scss/style.scss"],
     plugins: [
         { src: "~/plugins/boostrap.ts", mode: "client" },
         { src: "~/plugins/fontawesome.ts", mode: "client" },
@@ -57,7 +57,7 @@ export default defineNuxtConfig({
     ],
 
     alias: {
-        images: resolve(__dirname, "./static/assets/images"),
+        // images: resolve(__dirname, "./static/assets/images"),
         data: resolve(__dirname, "./static/data"),
     }
 });

package.json

@@ -17,7 +17,7 @@
         "postinstall": "nuxt prepare",
         "lint:ts": "npm run typecheck",
         "lint:js": "eslint --ext \".js,.ts,.vue\" --ignore-path .gitignore .",
-        "lint:style": "node ./node_modules/.bin/stylelint --config './.stylelintrc.json' --max-warnings 0 \"static/**/*.{css,scss,sass,html,vue}\" --ignore-path .gitignore",
+        "lint:style": "node ./node_modules/.bin/stylelint --config './.stylelintrc.json' --max-warnings 0 \"assets/**/*.{css,scss,sass,html,vue}\" --ignore-path .gitignore",
         "lint": "npm run lint:js && npm run lint:style && lint:ts",
         "lint:fix": "npm run lint:js --fix && npm run lint:style --fix",
         "validate": "npm-run-all --parallel lint:js lint:style lint:ts",

pages/brands/[slug].vue

@@ -6,7 +6,7 @@
       <div class="row">
         <div v-for="(range, rangeIndex) of brand.ranges" :key="rangeIndex" class="col-12 col-md-6">
           <div>
-            <img class="img-fluid" :src="`/assets/${range.picture}`" :alt="`Gamme ${range.name}`">
+            <img class="img-fluid" :src="`/data/${range.picture}`" :alt="`Gamme ${range.name}`">
           </div>
           <span class="fs-2 fw-bold">{{ range.name }}</span>
         </div>

pages/index.vue

@@ -20,7 +20,7 @@
         </div>
         <div class="col-6">
           <div class="d-inline-block" role="button" :title="`Voir les gammes de la marque ${brand.name}`" data-bs-toggle="tooltip" @click="gotoBrand(brand)">
-            <img class="img-fluid" :src="`/assets/${brand.picture}`" :alt="`Marque ${brand.name}`" :title="`Le logo de la marque ${brand.name}`">
+            <img class="img-fluid" :src="`/data/${brand.picture}`" :alt="`Marque ${brand.name}`" :title="`Le logo de la marque ${brand.name}`">
           </div>
         </div>
       </div>