Merge pull request #96 from dexterousdex/chat-style-tweaks

chat styling tweaks.
dimbleby · Aug 5, 2023 · eb5cff9 · eb5cff9
2 parents 4d453db + 3566120
commit eb5cff9
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/hunt/static/style.css b/hunt/static/style.css
@@ -126,6 +126,17 @@ body {
   align-items: center;
 }
 
+.chat-container {
+  max-width: 100%;
+}
+
+.chat-messages {
+  max-height: 300px;
+  overflow-y: scroll;
+  text-align: left;
+  overflow-wrap: anywhere;
+}
+
 .heading {
   padding: 0 5vw;
   display: flex;

diff --git a/hunt/templates/room.html b/hunt/templates/room.html
@@ -1,6 +1,6 @@
 <!DOCTYPE html>
 
-<div class="container">
+<div class="container chat-container">
   <div class="columns is-multiline">
     <div class="column is-full">
       <section class="hero is-primary">
@@ -12,7 +12,7 @@
 
     <div class="column is-full">
       <div class="box">
-        <div id="chat-messages" style="max-height: 300px; overflow-y: scroll;">
+        <div id="chat-messages" class="chat-messages">
             {% for message in messages %}
             <b>{{ message.name }}</b>: {{ message.content }}<br>
             {% endfor %}