Update content.py (#5)

- Update content.py (4970bddb3bbe1e3c93cb0648af9898731ad92f88)


Co-authored-by: Pablo Carrera <pabloce@users.noreply.huggingface.co>

content.py

@@ -17,14 +17,14 @@ css = """
 """
 
 PLACEHOLDER = """
-<div class="message-bubble-border" style="display:flex; max-width: 600px; border-radius: 8px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); backdrop-filter: blur(10px);">
+<div class="message-bubble-border" style="display:flex; max-width: 75%; border-radius: 8px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); backdrop-filter: blur(10px);">
     <figure style="margin: 0;">
         <img src="https://github.com/Maximilian-Winter/llama-cpp-agent/blob/master/logo/logo_orange.png?raw=true" alt="Logo" style="width: 100%; height: 100%; border-radius: 8px;">
     </figure>
     <div style="padding: .5rem 1.5rem;">
         <h2 style="text-align: left; font-size: 1.5rem; font-weight: 700; margin-bottom: 0.5rem;">llama-cpp-agent</h2>
         <p style="text-align: left; font-size: 16px; line-height: 1.5; margin-bottom: 15px;">The llama-cpp-agent framework you can engage in seamless conversations with most `open source LLMs`, even small ones. Execute functions using LLMs, single and parallel function calling. Process text using agent chains, with tools.</p>
-        <div style="display: flex; justify-content: flex-end;">
+        <div style="display: flex; justify-content: space-between;">
             <div style="display: flex; flex-flow: column; justify-content: space-between;">
                 <span style="display: inline-flex; align-items: center; border-radius: 0.375rem; background-color: rgba(229, 70, 77, 0.1); padding: 0.1rem 0.75rem; font-size: 0.75rem; font-weight: 500; color: #f88181; margin-bottom: 2.5px;">
                     Mistral 7B Instruct v0.3