pieter/eveAI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- Refinement of the chat client to have better visible clues for user vs chatbot messages

Browse Source 
- Introduction of interview_phase and normal phase in TRAICIE_SELECTION_SPECIALIST to make interaction with bot more human.
- More and random humanised messages to TRAICIE_SELECTION_SPECIALIST
This commit is contained in:
Josako
2025-08-02 16:36:41 +02:00
parent 998ddf4c03
commit 9a88582fff
50 changed files with 2064 additions and 384 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
eveai_chat_client/static/assets/css/chat-components.css
View File

@@ -79,23 +79,14 @@
}
/* Chat Input styling */
.chat-input-container {
width: 100%;
position: relative;
padding: 20px; /* Interne padding voor ChatInput */
box-sizing: border-box;
max-width: 1000px; /* Optimale breedte */
margin-left: auto;
margin-right: auto; /* Horizontaal centreren */
}
.chat-input {
display: flex;
align-items: flex-end;
gap: 12px;
padding: 20px;
background: var(--active-background-color);
color: var(--active-text-color);
background: var(--human-message-background);
color: var(--human-message-text-color);
border-radius: 15px;
box-shadow: 0 2px 15px rgba(0,0,0,0.1);
border: 1px solid rgba(0,0,0,0.05);
@@ -113,37 +104,6 @@
gap: 8px;
}
.send-btn {
width: 45px;
height: 45px;
border: none;
border-radius: 50%;
background: var(--active-background-color);
color: var(--active-text-color);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
transition: all 0.2s ease;
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}
.send-btn:hover:not(:disabled) {
background: var(--active-text-color);
color: var(--active-background-color);
transform: scale(1.05);
box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}
.send-btn:disabled {
background: #ccc;
cursor: not-allowed;
transform: none;
box-shadow: none;
}
/* Character counter */
.character-counter {
position: absolute;
@@ -152,7 +112,7 @@
font-size: 12px;
color: #666;
padding: 2px 6px;
background: rgba(255,255,255,0.9);
background: rgba(255,255,255,0.2);
border-radius: 10px;
backdrop-filter: blur(5px);
}
@@ -190,11 +150,6 @@
max-width: 100%; /* Op mobiel volledige breedte gebruiken */
}
.chat-input-container {
padding: 15px;
max-width: 100%; /* Op mobiel volledige breedte gebruiken */
}
.chat-input {
padding: 15px;
gap: 10px;
@@ -224,10 +179,6 @@
.message-history-container {
padding: 12px;
}
.chat-input-container {
padding: 12px;
}
}
/* Loading states */
@@ -343,16 +294,16 @@
/* User message bubble styling */
.message.user .message-content {
background: var(--history-user-message-background);
color: var(--history-message-text-color);
background: var(--human-message-background);
color: var(--human-message-text-color);
border-bottom-right-radius: 4px;
}
/* AI/Bot message bubble styling */
.message.ai .message-content,
.message.bot .message-content {
background: var(--history-ai-message-background);
color: var(--history-message-text-color);
background: var(--ai-message-background);
color: var(--ai-message-text-color);
border-bottom-left-radius: 4px;
margin-right: 60px;
}