Team Ai
Apppublic

Ray1mo/codegenius-ai-assistant-bot

sourceHugging Faceupdated 1y agoView on Hugging Face
0likes
style.css97 linesDownload Raw Back to root
1/* Base styles */2body {3    font-family: 'Inter', system-ui, -apple-system, sans-serif;4    line-height: 1.6;5}6/* Ultra-responsive chat styles */7.bot-message, .user-message {8    max-width: 90%;9    transition: all 0.2s ease;10}11 12.user-message {13    margin-left: auto;14    background-color: #f3f4f6;15    padding: 0.8rem;16    border-radius: 0.75rem;17    max-width: 80%;18}19 20@media (max-width: 640px) {21    .bot-message, .user-message {22        max-width: 95%;23        padding: 0.6rem;24    }25    26    .chat-container {27        padding: 0.8rem !important;28    }29    30    #chat-messages {31        max-height: 60vh !important;32    }33}34 35/* Faster animations */36@keyframes fadeIn {37    from { opacity: 0; transform: translateY(5px); }38    to { opacity: 1; transform: translateY(0); }39}40 41.new-message {42    animation: fadeIn 0.15s ease-out;43}44 45/* Optimized code blocks */46pre {47    margin: 0.5rem 0 !important;48    padding: 0.8rem !important;49    font-size: 0.9em;50}51/* Code block styles */52pre {53    background-color: #1e293b;54    color: #f8fafc;55    padding: 1rem;56    border-radius: 0.5rem;57    overflow-x: auto;58    margin: 1rem 0;59    font-family: 'Fira Code', monospace;60}61 62code {63    font-family: 'Fira Code', monospace;64    background-color: #e2e8f0;65    padding: 0.2rem 0.4rem;66    border-radius: 0.25rem;67    font-size: 0.9em;68}69 70/* Animation for new messages */71@keyframes fadeIn {72    from { opacity: 0; transform: translateY(10px); }73    to { opacity: 1; transform: translateY(0); }74}75 76.new-message {77    animation: fadeIn 0.3s ease-out;78}79 80/* Scrollbar styling */81::-webkit-scrollbar {82    width: 8px;83    height: 8px;84}85 86::-webkit-scrollbar-track {87    background: #f1f1f1;88}89 90::-webkit-scrollbar-thumb {91    background: #cbd5e1;92    border-radius: 4px;93}94 95::-webkit-scrollbar-thumb:hover {96    background: #94a3b8;97}