add svg for file

js/main.js

@@ -1064,24 +1064,46 @@ var render = function render() {
     }, [_c("div", {
       staticClass: "w-12 h-12 flex items-center justify-center"
     }, [file.type === "directory" ? [_c("svg", {
-      staticClass: "text-NcBlue",
+      staticClass: "text-NcBlue w-10 h-10",
       attrs: {
         fill: "currentColor",
-        width: "40",
-        height: "40",
         viewBox: "0 0 24 24"
       }
     }, [_c("path", {
       attrs: {
         d: "M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z"
       }
-    })])] : [_vm._m(1, true)]], 2), _vm._v(" "), _c("div", {
+    })])] : [_c("div", {
+      staticClass: "flex items-center justify-center"
+    }, [_c("svg", {
+      staticClass: "w-10 h-10",
+      staticStyle: {
+        "fill-rule": "evenodd",
+        "clip-rule": "evenodd",
+        "stroke-linejoin": "round",
+        "stroke-miterlimit": "2"
+      },
+      attrs: {
+        viewBox: "0 0 16 16",
+        xmlns: "http://www.w3.org/2000/svg",
+        "xml:space": "preserve"
+      }
+    }, [_c("path", {
+      staticStyle: {
+        fill: "#969696",
+        "fill-rule": "nonzero"
+      },
+      attrs: {
+        d: "M6 22c-.55 0-1.021-.196-1.412-.587A1.927 1.927 0 0 1 4 20V4c0-.55.196-1.021.588-1.413A1.926 1.926 0 0 1 6 2h8l6 6v12a1.93 1.93 0 0 1-.587 1.413A1.93 1.93 0 0 1 18 22H6Z",
+        transform: "matrix(.7 0 0 .7 -.43 -.388)"
+      }
+    })])])]], 2), _vm._v(" "), _c("div", {
       staticClass: "ml-4"
     }, [_vm._v(_vm._s(file.basename))])]), _vm._v(" "), _c("div", {
       staticClass: "cursor-pointer w-1/6 px-4 py-2 border-r border-gray-300"
-    }, [_vm._v("\n    " + _vm._s(file.type === "directory" ? "Dossier" : "Fichier") + "\n    ")]), _vm._v(" "), _c("div", {
+    }, [_vm._v("\r\n    " + _vm._s(file.type === "directory" ? "Dossier" : "Fichier") + "\r\n    ")]), _vm._v(" "), _c("div", {
       staticClass: "cursor-pointer w-1/6 px-4 py-2"
-    }, [_vm._v("\n    " + _vm._s(file.type === "directory" ? "-" : _vm.formatFileSize(file.size)) + "\n    ")])]);
+    }, [_vm._v("\r\n    " + _vm._s(file.type === "directory" ? "-" : _vm.formatFileSize(file.size)) + "\r\n    ")])]);
   })], 2);
 };
 var staticRenderFns = [function () {
@@ -1096,19 +1118,6 @@ var staticRenderFns = [function () {
   }, [_vm._v("Type")]), _vm._v(" "), _c("div", {
     staticClass: "w-1/6 px-4 py-2 text-gray-500 font-semibold"
   }, [_vm._v("Taille")])]);
-}, function () {
-  var _vm = this,
-    _c = _vm._self._c;
-  return _c("div", {
-    staticClass: "flex items-center justify-center"
-  }, [_c("img", {
-    staticClass: "files-list__row-icon-preview files-list__row-icon-preview--loaded w-10 h-10",
-    attrs: {
-      alt: "",
-      loading: "lazy",
-      src: "http://nextcloud.local/index.php/core/preview?fileId=161&x=32&y=32&mimeFallback=true&v=030b13&a=0"
-    }
-  })]);
 }];
 render._withStripped = true;
 
@@ -2439,8 +2448,8 @@ __webpack_require__.r(__webpack_exports__);
 
 var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, `
+___CSS_LOADER_EXPORT___.push([module.id, `
-/* Vous pouvez ajouter des styles personnalisés ici si nécessaire */
+/* Vous pouvez ajouter des styles personnalisés ici si nécessaire */
 `, ""]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
@@ -3039,10 +3048,6 @@ video {
   display: flex;
 }
 
-.h-10 {
-  height: 2.5rem;
-}
-
 .h-12 {
   height: 3rem;
 }
@@ -3055,8 +3060,8 @@ video {
   height: 100%;
 }
 
-.h-8 {
+.h-10 {
-  height: 2rem;
+  height: 2.5rem;
 }
 
 .max-h-8 {
@@ -3071,10 +3076,6 @@ video {
   width: 16.666667%;
 }
 
-.w-10 {
-  width: 2.5rem;
-}
-
 .w-12 {
   width: 3rem;
 }
@@ -3091,6 +3092,18 @@ video {
   width: 100%;
 }
 
+.w-10 {
+  width: 2.5rem;
+}
+
+.w-16 {
+  width: 4rem;
+}
+
+.transform {
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .cursor-pointer {
   cursor: pointer;
 }

src/assets/file.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 16 16" height="16" width="16" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2"><path d="M6 22c-.55 0-1.021-.196-1.412-.587A1.927 1.927 0 0 1 4 20V4c0-.55.196-1.021.588-1.413A1.926 1.926 0 0 1 6 2h8l6 6v12a1.93 1.93 0 0 1-.587 1.413A1.93 1.93 0 0 1 18 22H6Z" style="fill:#969696;fill-rule:nonzero" transform="matrix(.7 0 0 .7 -.43 -.388)"/></svg>

src/components/FileTable.vue

@@ -32,22 +32,28 @@
     <div class="cursor-pointer w-4/6 flex items-center px-4 py-2 border-r border-gray-300">
     <div class="w-12 h-12 flex items-center justify-center">
         <template v-if="file.type === 'directory'">
-        <svg
+            <svg
-            fill="currentColor"
+                fill="currentColor"
-            width="40"
+                viewBox="0 0 24 24"
-            height="40"
+                class="text-NcBlue w-10 h-10"  
-            viewBox="0 0 24 24"
+            >
-            class="text-NcBlue"
+                <path
-        >
+                    d="M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z"
-            <path
+                ></path>
-            d="M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z"
+            </svg>
-            ></path>
-        </svg>
         </template>
         <template v-else>
-        <div class="flex items-center justify-center">
+            <div class="flex items-center justify-center">
-            <img alt="" loading="lazy" src="http://nextcloud.local/index.php/core/preview?fileId=161&amp;x=32&amp;y=32&amp;mimeFallback=true&amp;v=030b13&amp;a=0" class="files-list__row-icon-preview files-list__row-icon-preview--loaded w-10 h-10 ">
+                <svg 
-        </div>
+                    viewBox="0 0 16 16" 
+                    xmlns="http://www.w3.org/2000/svg" 
+                    xml:space="preserve" 
+                    class="w-10 h-10"
+                    style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2"
+                >
+                    <path d="M6 22c-.55 0-1.021-.196-1.412-.587A1.927 1.927 0 0 1 4 20V4c0-.55.196-1.021.588-1.413A1.926 1.926 0 0 1 6 2h8l6 6v12a1.93 1.93 0 0 1-.587 1.413A1.93 1.93 0 0 1 18 22H6Z" style="fill:#969696;fill-rule:nonzero" transform="matrix(.7 0 0 .7 -.43 -.388)"/>
+                </svg>
+            </div>
         </template>
     </div>
     <div class="ml-4">{{ file.basename }}</div>

src/output.css

@@ -569,10 +569,6 @@ video {
   display: flex;
 }
 
-.h-10 {
-  height: 2.5rem;
-}
-
 .h-12 {
   height: 3rem;
 }
@@ -585,8 +581,8 @@ video {
   height: 100%;
 }
 
-.h-8 {
+.h-10 {
-  height: 2rem;
+  height: 2.5rem;
 }
 
 .max-h-8 {
@@ -601,10 +597,6 @@ video {
   width: 16.666667%;
 }
 
-.w-10 {
-  width: 2.5rem;
-}
-
 .w-12 {
   width: 3rem;
 }
@@ -621,6 +613,18 @@ video {
   width: 100%;
 }
 
+.w-10 {
+  width: 2.5rem;
+}
+
+.w-16 {
+  width: 4rem;
+}
+
+.transform {
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .cursor-pointer {
   cursor: pointer;
 }