bachir/drupal-figli-compta
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Open the entrée/versement drill-down in a modal instead of in place

Browse Source 
Replacing the main table's rows with the filtered group made the browser
clamp scrollTop to 0 the moment the drill-down shrank the visible content,
so closing it never returned to where the user had been scrolled. A modal
overlay leaves the main table (and its scroll position) untouched entirely.
This commit is contained in:
bachir
2026-09-05 13:16:44 +02:00
parent 0f33d57ec0
commit 9ec0aa4699
3 changed files with 151 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/modules/custom/figli_compta_ledger/css/home.css
+62
View File
@@ -332,6 +332,68 @@ html.gin--dark-mode #figli-home-app {
padding: 0.2rem 0.6rem;
}
/* Entrée + sorties liées drill-down: a modal overlay rather than
replacing the main table's rows in place, so opening/closing it never
disturbs the main table's scroll position. */
#figli-home-app .figli-modal-backdrop {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
z-index: 100;
}
#figli-home-app .figli-modal {
background: var(--figli-bg);
color: var(--figli-text);
border: 1px solid var(--figli-border);
border-radius: 8px;
max-width: 90vw;
max-height: 85vh;
width: 900px;
display: flex;
flex-direction: column;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}
#figli-home-app .figli-modal-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.75rem 1rem;
border-bottom: 1px solid var(--figli-border);
}
#figli-home-app .figli-modal-header h3 {
margin: 0;
font-size: 0.95rem;
font-weight: 700;
}
#figli-home-app .figli-modal-close {
background: transparent;
border: 1px solid transparent;
border-radius: 4px;
color: var(--figli-text-light);
cursor: pointer;
font-size: 0.9rem;
padding: 0.15rem 0.45rem;
}
#figli-home-app .figli-modal-close:hover {
background: var(--figli-bg-alt);
border-color: var(--figli-border);
color: var(--figli-text);
}
#figli-home-app .figli-modal-body {
overflow: auto;
padding: 0;
}
#figli-home-app .figli-modal-body table {
font-size: 0.8rem;
}
#figli-home-app .figli-modal-body thead th {
position: sticky;
top: 0;
}
/* Sliding-window edge markers (IntersectionObserver targets) -- kept
short so they don't add visible dead space when idle, tall enough
(min-height) to reliably intersect the observer's root margin. */