feat: enhance chat UI and functionality with new scrollbar and animation features

- Added custom scrollbar styles for sources display to improve aesthetics and usability.
- Introduced animations for reasoning steps to enhance user experience during chat interactions.
- Refactored chat page to group thinking messages, improving message handling and display.
- Updated sources display component for better favicon handling and user interaction.
This commit is contained in:
Evandro Fonseca Junior committed 2025-11-27 16:57:50 -03:00
1 parent e5f062040c
commit f2e8a1b933
6 files changed
+453 -189

No files matched your search

+59 -1
View File
@@ -296,4 +296,62 @@
.sidebar-chat-list {
scrollbar-width: thin;
scrollbar-color: hsl(var(--muted-foreground) / 0.3) transparent;
}
}
/* Minimalista scrollbar para sources */
.sources-scrollbar {
scrollbar-width: thin;
scrollbar-color: hsl(var(--muted-foreground) / 0.2) transparent;
}
.sources-scrollbar::-webkit-scrollbar {
height: 4px;
}
.sources-scrollbar::-webkit-scrollbar-track {
background: transparent;
border-radius: 2px;
}
.sources-scrollbar::-webkit-scrollbar-thumb {
background: hsl(var(--muted-foreground) / 0.2);
border-radius: 2px;
transition: background 0.2s ease;
}
.sources-scrollbar::-webkit-scrollbar-thumb:hover {
background: hsl(var(--muted-foreground) / 0.35);
}
/* Ocultar scrollbar quando não há overflow */
.sources-scrollbar:not(:hover)::-webkit-scrollbar-thumb {
background: transparent;
}
/* Reasoning Chain animations */
@keyframes reasoning-fade-in {
from {
opacity: 0;
transform: translateY(4px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.reasoning-step {
animation: reasoning-fade-in 0.3s ease-out forwards;
opacity: 0;
}
/* Staggered reveal para steps */
.reasoning-step:nth-child(1) { animation-delay: 0ms; }
.reasoning-step:nth-child(2) { animation-delay: 100ms; }
.reasoning-step:nth-child(3) { animation-delay: 200ms; }
.reasoning-step:nth-child(4) { animation-delay: 300ms; }
.reasoning-step:nth-child(5) { animation-delay: 400ms; }
.reasoning-step:nth-child(6) { animation-delay: 500ms; }
.reasoning-step:nth-child(7) { animation-delay: 600ms; }
.reasoning-step:nth-child(8) { animation-delay: 700ms; }
.reasoning-step:nth-child(n+9) { animation-delay: 800ms; }