mirror of
https://github.com/geoffsee/predict-otron-9001.git
synced 2025-09-08 22:46:44 +00:00
8338750beb
Removed `test_request.sh`, deprecated functionality, and unused imports; introduced a new CLI tool (`cli.ts`) for testing inference engine and adjusted handling of non-streaming/streaming chat completions. - Add CPU fallback support for text generation when primary device is unsupported - Introduce `execute_with_fallback` method to handle device compatibility and shape mismatch errors - Extend unit tests to reproduce tensor shape mismatch errors specific to model configurations - Increase HTTP timeout limits in `curl_chat_stream.sh` script for reliable API testing chat completion endpoint functions with gemma3 (no streaming) Add benchmarking guide with HTML reporting, Leptos chat crate, and middleware for metrics tracking
165 lines
2.9 KiB
CSS
165 lines
2.9 KiB
CSS
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
margin: 0;
|
|
padding: 0;
|
|
background-color: #f5f5f5;
|
|
}
|
|
|
|
.chat-container {
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
background-color: white;
|
|
box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
h1 {
|
|
background-color: #4a90e2;
|
|
color: white;
|
|
margin: 0;
|
|
padding: 20px;
|
|
text-align: center;
|
|
font-size: 24px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.messages-container {
|
|
flex: 1;
|
|
overflow-y: auto;
|
|
padding: 20px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 15px;
|
|
}
|
|
|
|
.message {
|
|
display: flex;
|
|
flex-direction: column;
|
|
max-width: 70%;
|
|
padding: 12px 16px;
|
|
border-radius: 18px;
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
.user-message {
|
|
align-self: flex-end;
|
|
background-color: #4a90e2;
|
|
color: white;
|
|
}
|
|
|
|
.assistant-message {
|
|
align-self: flex-start;
|
|
background-color: #e9ecef;
|
|
color: #333;
|
|
}
|
|
|
|
.system-message {
|
|
align-self: center;
|
|
background-color: #ffebcc;
|
|
color: #856404;
|
|
border: 1px solid #ffeaa7;
|
|
}
|
|
|
|
.message-role {
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
margin-bottom: 4px;
|
|
opacity: 0.7;
|
|
text-transform: capitalize;
|
|
}
|
|
|
|
.message-content {
|
|
font-size: 14px;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.input-form {
|
|
display: flex;
|
|
padding: 20px;
|
|
gap: 10px;
|
|
background-color: #f8f9fa;
|
|
border-top: 1px solid #dee2e6;
|
|
}
|
|
|
|
.message-input {
|
|
flex: 1;
|
|
padding: 12px 16px;
|
|
border: 1px solid #ced4da;
|
|
border-radius: 25px;
|
|
font-size: 14px;
|
|
outline: none;
|
|
transition: border-color 0.2s ease;
|
|
}
|
|
|
|
.message-input:focus {
|
|
border-color: #4a90e2;
|
|
box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.25);
|
|
}
|
|
|
|
.message-input:disabled {
|
|
background-color: #f8f9fa;
|
|
color: #6c757d;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.send-button {
|
|
padding: 12px 24px;
|
|
background-color: #4a90e2;
|
|
color: white;
|
|
border: none;
|
|
border-radius: 25px;
|
|
font-size: 14px;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
transition: background-color 0.2s ease;
|
|
min-width: 80px;
|
|
}
|
|
|
|
.send-button:hover:not(:disabled) {
|
|
background-color: #357abd;
|
|
}
|
|
|
|
.send-button:disabled {
|
|
background-color: #6c757d;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
/* Scrollbar styling */
|
|
.messages-container::-webkit-scrollbar {
|
|
width: 8px;
|
|
}
|
|
|
|
.messages-container::-webkit-scrollbar-track {
|
|
background: #f1f1f1;
|
|
}
|
|
|
|
.messages-container::-webkit-scrollbar-thumb {
|
|
background: #c1c1c1;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.messages-container::-webkit-scrollbar-thumb:hover {
|
|
background: #a1a1a1;
|
|
}
|
|
|
|
/* Responsive design */
|
|
@media (max-width: 768px) {
|
|
.chat-container {
|
|
height: 100vh;
|
|
}
|
|
|
|
.message {
|
|
max-width: 85%;
|
|
}
|
|
|
|
.input-form {
|
|
padding: 15px;
|
|
}
|
|
|
|
h1 {
|
|
padding: 15px;
|
|
font-size: 20px;
|
|
}
|
|
} |