fix: Favorites & Drives changed when changing the main layout and remove tilt effect

src/Components/ContextMenu/contextMenu.ts

@@ -238,7 +238,7 @@ const ContextMenuInner = (target: HTMLElement, coorX:number, coorY:number, open:
             const clickSubmenuEvent = (e:Event) => {
                 const target = e.target as HTMLElement;
                 if (target.getAttribute("role")) {
-                    const files = document.querySelectorAll<HTMLElement>(".file")
+                    const files = document.querySelectorAll<HTMLElement>(".file + div:not(.favorite) + div:not(.pendrive)")
                     const layout = storage.get('layout')?.data ?? {}
                     const sort = storage.get('layout')?.data ?? {}
                     const tabs = storage.get(`tabs-${windowGUID}`)?.data

src/Components/Drives/drives.ts

@@ -71,7 +71,7 @@ const drivesToElements = (drives: Drive[], kBlockFormat = false): string => {
 		const driveName =
 			drive.mounted.split('/')[drive.mounted.split('/').length - 1]; // Get name of drive
 		result += `
-        <div class="pendrive file card-hover-effect" data-tilt data-isdir="true" data-listenOpen data-path = "${getDriveBasePath(
+        <div class="pendrive file card-hover-effect" data-isdir="true" data-listenOpen data-path = "${getDriveBasePath(
 			drive.mounted
 		)}">
             <img src="${fileIcon(

src/Components/Favorites/favorites.ts

@@ -9,22 +9,22 @@ import getPath from "platform-folders"
 const Favorites = ():string => {
     const result = `<section class="home-section">
         <h2 class="section-title">${Translate("Favorites")}</h2>
-        <div class="favorite file card-hover-effect" data-tilt data-listenOpen data-isdir="true" data-path="${getPath("desktop")}">
+        <div class="favorite file card-hover-effect" data-listenOpen data-isdir="true" data-path="${getPath("desktop")}">
             <h3 class="favorite-title"><img src="${fileIcon('desktop', "favorites", false)}" alt="Desktop icon" class="favorite-icon">${Translate("Desktop")}</h3>
         </div>
-        <div class="favorite file card-hover-effect" data-tilt data-listenOpen data-isdir="true" data-path="${getPath("documents")}">
+        <div class="favorite file card-hover-effect" data-listenOpen data-isdir="true" data-path="${getPath("documents")}">
             <h3 class="favorite-title"><img src="${fileIcon('document', "favorites", false)}" alt="Document icon" class="favorite-icon">${Translate("Documents")}</h3>
         </div>
-        <div class="favorite file card-hover-effect" data-tilt data-listenOpen data-isdir="true" data-path="${getPath("downloads")}">
+        <div class="favorite file card-hover-effect" data-listenOpen data-isdir="true" data-path="${getPath("downloads")}">
             <h3 class="favorite-title"><img src="${fileIcon('download', "favorites", false)}" alt="Download icon" class="favorite-icon">${Translate("Downloads")}</h3>
         </div>
-        <div class="favorite file card-hover-effect" data-tilt data-listenOpen data-isdir="true" data-path="${getPath("pictures")}">
+        <div class="favorite file card-hover-effect" data-listenOpen data-isdir="true" data-path="${getPath("pictures")}">
             <h3 class="favorite-title"><img src="${fileIcon('picture', "favorites", false)}" alt="Pictures icon" class="favorite-icon">${Translate("Pictures")}</h3>
         </div>
-        <div class="favorite file card-hover-effect" data-tilt data-listenOpen data-isdir="true" data-path="${getPath("music")}">
+        <div class="favorite file card-hover-effect" data-listenOpen data-isdir="true" data-path="${getPath("music")}">
             <h3 class="favorite-title"><img src="${fileIcon('music', "favorites", false)}" alt="Music icon" class="favorite-icon">${Translate("Music")}</h3>
         </div>
-        <div class="favorite file card-hover-effect" data-tilt data-listenOpen data-isdir="true" data-path="${getPath("videos")}">
+        <div class="favorite file card-hover-effect" data-listenOpen data-isdir="true" data-path="${getPath("videos")}">
             <h3 class="favorite-title"><img src="${fileIcon('video', "favorites", false)}" alt="Video icon" class="favorite-icon">${Translate("Videos")}</h3>
         </div></section>
         `;

src/Components/Files/File Operation/open.ts

@@ -176,7 +176,6 @@ const displayFiles = async (files: fileData[], dir:string, options?: {reveal: bo
             }
             fileGrid.setAttribute("draggable", 'true')
             fileGrid.setAttribute("data-listenOpen", '')
-            fileGrid.setAttribute("data-tilt", '')
             fileGrid.dataset.modifiedAt = String(dirent.modifiedAt);
             fileGrid.dataset.createdAt = String(dirent.createdAt);
             fileGrid.dataset.accessedAt = String(dirent.accessedAt);

src/Components/Layout/home.ts

@@ -111,7 +111,7 @@ const homeFiles = (callback: cb) => {
 				isHiddenFile(path.join(os.homedir(), file.name))
 					? 'data-hidden-file'
 					: ''
-			} data-tilt data-size="${file.size}" data-created-at="${
+			} data-size="${file.size}" data-created-at="${
 				file.createdAt
 			}" data-modified-at="${file.modifiedAt}" data-accessed-at="${
 				file.accessedAt

src/Components/Recent/recent.ts

@@ -72,7 +72,6 @@ const Recent = async (): Promise<void> => {
 			}
 			fileGrid.setAttribute('draggable', 'true');
 			fileGrid.setAttribute('data-listenOpen', '');
-			fileGrid.setAttribute('data-tilt', '');
 			fileGrid.dataset.path = escape(recent);
 			fileGrid.innerHTML = `
             ${preview}

src/Components/Theme/theme.ts

@@ -1,6 +1,5 @@
 import fs from 'fs';
 import storage from "electron-json-storage-sync";
-import VanillaTilt from "../../Lib/tilt/tilt";
 import os from "os";
 import { nativeTheme } from '@electron/remote';
 import { ipcRenderer } from 'electron';
@@ -213,7 +212,6 @@ const changeTheme = (document:Document, theme:string): void => {
         changeElementTheme(grid, "gridBackground", "background", theme)
         changeElementTheme(grid, "gridColor", "color", theme)
     })
-    VanillaTilt();
     return;
 }