📚 Improved admin UI layout & design consistency 🎨

This commit is contained in:
2025-06-01 17:03:31 +02:00
parent 52d0bad64f
commit 7de193d4b2
5 changed files with 202 additions and 354 deletions

View File

@ -270,6 +270,10 @@
0 4px 6px -1px rgba(0, 0, 0, 0.1);
border-radius: 16px;
backdrop-filter: blur(10px);
max-height: 90vh;
overflow-y: auto;
scrollbar-width: thin;
scrollbar-color: rgba(0, 115, 206, 0.2) transparent;
}
.dark .mercedes-modal {
@ -278,6 +282,35 @@
box-shadow:
0 25px 50px -12px rgba(0, 0, 0, 0.5),
0 4px 6px -1px rgba(0, 0, 0, 0.3);
scrollbar-color: rgba(59, 130, 246, 0.3) transparent;
}
/* Improved Modal Scrollbar Styling */
.mercedes-modal::-webkit-scrollbar {
width: 8px;
}
.mercedes-modal::-webkit-scrollbar-track {
background: transparent;
border-radius: 4px;
}
.mercedes-modal::-webkit-scrollbar-thumb {
background: rgba(0, 115, 206, 0.2);
border-radius: 4px;
transition: all 0.3s ease;
}
.mercedes-modal::-webkit-scrollbar-thumb:hover {
background: rgba(0, 115, 206, 0.4);
}
.dark .mercedes-modal::-webkit-scrollbar-thumb {
background: rgba(59, 130, 246, 0.3);
}
.dark .mercedes-modal::-webkit-scrollbar-thumb:hover {
background: rgba(59, 130, 246, 0.5);
}
/* Loading States */
@ -436,19 +469,39 @@
.mercedes-modal {
max-height: 90vh;
overflow-y: auto;
scrollbar-width: thin;
scrollbar-color: rgba(0, 115, 206, 0.2) transparent;
}
.dark .mercedes-modal {
scrollbar-color: rgba(59, 130, 246, 0.3) transparent;
}
.mercedes-modal::-webkit-scrollbar {
width: 6px;
width: 8px;
}
.mercedes-modal::-webkit-scrollbar-track {
background: transparent;
border-radius: 4px;
}
.mercedes-modal::-webkit-scrollbar-thumb {
background: rgba(0, 115, 206, 0.2);
border-radius: 3px;
border-radius: 4px;
transition: all 0.3s ease;
}
.mercedes-modal::-webkit-scrollbar-thumb:hover {
background: rgba(0, 115, 206, 0.3);
background: rgba(0, 115, 206, 0.4);
}
.dark .mercedes-modal::-webkit-scrollbar-thumb {
background: rgba(59, 130, 246, 0.3);
}
.dark .mercedes-modal::-webkit-scrollbar-thumb:hover {
background: rgba(59, 130, 246, 0.5);
}
</style>
{% endblock %}