Fix model details modal interactions and scrolling

This commit is contained in:
Luca Sacchi Ricciardi
2026-04-25 14:05:11 +02:00
parent 87ebd35ad5
commit eea6e2a80e
2 changed files with 51 additions and 5 deletions
+23 -3
View File
@@ -14,6 +14,24 @@
.animate-spin {
animation: spin 1s linear infinite;
}
.modal-body {
max-height: 80vh;
overflow-y: auto;
padding-right: 10px;
scrollbar-width: thin;
scrollbar-color: #8b5cf6 #1f2937;
}
.modal-body::-webkit-scrollbar {
width: 8px;
}
.modal-body::-webkit-scrollbar-track {
background: #1f2937;
border-radius: 4px;
}
.modal-body::-webkit-scrollbar-thumb {
background: #8b5cf6;
border-radius: 4px;
}
</style>
</head>
<body class="bg-gray-900 text-white">
@@ -104,9 +122,9 @@
</div>
<!-- Model Show Details Modal -->
<div id="model-details-modal" class="hidden fixed inset-0 z-50">
<div id="model-details-modal" class="hidden fixed inset-0 z-50 items-center justify-center" aria-hidden="true">
<div id="model-details-backdrop" class="absolute inset-0 bg-black/70"></div>
<div class="relative min-h-screen flex items-center justify-center p-4">
<div id="model-details-dialog" class="relative w-full min-h-screen items-center justify-center p-4">
<div id="model-details-section" class="w-full max-w-4xl bg-gray-800 rounded-lg border border-gray-700 p-6 shadow-xl">
<div class="flex items-center justify-between mb-4">
<div>
@@ -115,7 +133,9 @@
</div>
<button id="model-details-close" type="button" class="text-gray-300 hover:text-white text-2xl leading-none px-2" aria-label="Chiudi modal">×</button>
</div>
<pre id="model-details-content" class="bg-gray-900 text-gray-200 text-xs p-4 rounded-lg overflow-auto max-h-[70vh] whitespace-pre-wrap"></pre>
<div class="modal-body">
<pre id="model-details-content" class="bg-gray-900 text-gray-200 text-xs p-4 rounded-lg whitespace-pre-wrap"></pre>
</div>
</div>
</div>
</div>