|
<!DOCTYPE html> |
|
<html lang="fr"> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<title>Mariam AI!</title> |
|
<style> |
|
body { font-family: Arial, sans-serif; margin: 2em; } |
|
.chat-message { margin-bottom: 1em; padding: 0.5em; border: 1px solid |
|
.user { background-color: |
|
.assistant { background-color: |
|
.settings { margin-bottom: 2em; } |
|
</style> |
|
</head> |
|
<body> |
|
<h1>Mariam AI!</h1> |
|
|
|
<div class="settings"> |
|
<form action="{{ url_for('index') }}" method="post" enctype="multipart/form-data"> |
|
<label for="toggle_web_search">Activer la recherche web :</label> |
|
<input type="checkbox" name="toggle_web_search" id="toggle_web_search" {% if web_search %}checked{% endif %}> |
|
<br><br> |
|
<label for="file">Télécharger un fichier (image/document) :</label> |
|
<input type="file" name="file" id="file" accept=".jpg,.jpeg,.png,.mp4,.mp3,.pdf,.txt"> |
|
<br><br> |
|
<label for="prompt">Hey ?</label> |
|
<input type="text" name="prompt" id="prompt" required style="width: 60%;"> |
|
<br><br> |
|
<button type="submit">Envoyer</button> |
|
</form> |
|
</div> |
|
|
|
<hr> |
|
|
|
<div> |
|
<h2>Historique du Chat</h2> |
|
{% for msg in chat_history %} |
|
<div class="chat-message {{ msg.role }}"> |
|
<strong>{{ msg.role|capitalize }} :</strong> |
|
<p>{{ msg.message|safe }}</p> |
|
</div> |
|
{% endfor %} |
|
</div> |
|
</body> |
|
</html> |
|
|
