| css = """ | |
| .message-row { | |
| justify-content: space-evenly !important; | |
| } | |
| .message-bubble-border { | |
| border-radius: 6px !important; | |
| } | |
| .message-buttons-bot, .message-buttons-user { | |
| right: 10px !important; | |
| left: auto !important; | |
| bottom: 2px !important; | |
| } | |
| .dark.message-bubble-border { | |
| border-color: #21293b !important; | |
| } | |
| .dark.user { | |
| background: #0a1120 !important; | |
| } | |
| .dark.assistant { | |
| background: transparent !important; | |
| } | |
| """ | |
| PLACEHOLDER = """ | |
| <div class="message-bubble-border" style="display:flex; max-width: 600px; border-color: #e5e7eb; border-radius: 8px; border-width: 1px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); backdrop-filter: blur(10px);"> | |
| <figure style="margin: 0;"> | |
| <img src="https://huggingface.co/spaces/baconnier/Napoleon/resolve/main/napoleon.jpg" alt="Logo" style="width: 100%; height: 100%; border-radius: 8px;"> | |
| </figure> | |
| <div style="padding: .5rem 1.5rem;"> | |
| <h2 style="text-align: center; font-size: 1.5rem; font-weight: 900; margin-bottom: 0.5rem;">🦅 Napoléon 🦅</h2> | |
| <p style="text-align: center; font-size: 16px; line-height: 1.5; margin-bottom: 15px;">Notre sagesse vient de notre expérience, et notre expérience vient de nos sottises.</p> | |
| <p></p> | |
| <p style="text-align: center; font-size: 16px; line-height: 1.5; margin-bottom: 15px;">Our wisdom comes from our experience, and our experience comes from our foolishness.</p> | |
| </div> | |
| </div> | |
| """ |