piair/MyINPulse
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: enhancing canvass layout

Browse Source
This commit is contained in:
ALAMI Adnane 2025-02-11 20:47:37 +01:00
parent 09e4b3262f
commit 22ebb0e1f4
3 changed files with 18 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
front/MyINPulse-front/src/components/canvas/CanvasItem.vue
View File

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

1
front/MyINPulse-front/src/components/canvas/LeanCanvas.vue
View File

@ -46,7 +46,6 @@ export default {
padding: 10px; padding: 10px;
max-width: 1200px; max-width: 1200px;
margin: 20px auto; margin: 20px auto;
border: 2px dashed #d33;
background-color: #fff; background-color: #fff;
position: relative; position: relative;
height: 80vh; height: 80vh;

17
front/MyINPulse-front/src/components/canvas/style-project.css
View File

@ -4,15 +4,6 @@ body {
padding: 10px; padding: 10px;
} }
.canvas {
display: flex;
flex-direction: column;
max-width: 1200px;
margin: 20px auto;
border: 2px dashed #d33;
background: #fff;
}
.row { .row {
display: flex; display: flex;
} }
@ -67,14 +58,6 @@ body {
margin-bottom: 10px; margin-bottom: 10px;
} }
.cell {
flex: 1;
border: 1px solid #ddd;
padding: 20px;
text-align: center;
background-color: #f1f1f1;
}
#ade { #ade {
max-width: 1200px; max-width: 1200px;
margin: 20px auto; margin: 20px auto;