feat: enhancing canvass layout

front/MyINPulse-front/src/components/canvas/CanvasItem.vue

@@ -26,7 +26,7 @@
         currentDescription.value = expanded.value
           ? "3 problèmes essentiels à résoudre pour le client"
           : "FAKE DATA";
-        
+
           expanded.value = !expanded.value;
       };
   
@@ -42,7 +42,7 @@
   <style scoped>
   @import "@/components/canvas/style-project.css";
   
-	.cell {
+  .cell {
 		display: flex;
 		flex-direction: column;
 		align-items: center;
@@ -50,15 +50,24 @@
 		text-align: center;
 		transition: all 0.3s ease;
 		cursor: pointer;
+    box-shadow: 0 4px 5px rgba(0, 0, 0, 0.1);
 	}
 
-  .cell_Expanded {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		transition: all 0.3s ease;
-		cursor: pointer;
-	}
+  .cell:not(.expanded):hover {
+    transform: scale(1.05);
+    box-shadow: 0 8px 9px rgba(0, 0, 0, 0.2);
+  }
+
+  .cell h3 {
+      font-size: 20px;
+      font-weight: 500;
+      /*margin-bottom: 10px;*/
+  }
+
+  .cell p {
+      font-size: 14px;
+      color: #666;
+  }
 
 	.expanded {
     position: fixed;