diff --git a/src/snek/templates/web.html b/src/snek/templates/web.html
index 4078d92..01c5506 100644
--- a/src/snek/templates/web.html
+++ b/src/snek/templates/web.html
@@ -1,99 +1,89 @@
 {% extends "app.html" %} 
+
 {% block main %}
-    <section class="chat-area" id="chat">
-    <div class="chat-header"><h2>{{ channel.label.value }}</h2></div>
+<section class="chat-area" id="chat">
+    <div class="chat-header">
+        <h2>{{ channel.label.value }}</h2>
+    </div>
     <div class="chat-messages">
-        
         {% for message in messages %}
-        {% autoescape false %}
-        {{message.html}}
-        {% endautoescape %}
-        <div style="display:none" class="message {% if loop.first or message.username != messages[loop.index0 - 1].username %}switch-user{% endif %}" data-uid="{{message.uid}}" data-color="{{message.color}}" data-user_nick="{{message.user_nick}}" data-created_at="{{message.created_at}}">
-                <div class="avatar no-select" style="background-color: {{message.color}}; color: black;">{{message.user_nick[0]}}</div> 
-            <div class="message-content">
-        {% autoescape false %}
-                {{ message.html }}
-            
-        {% endautoescape %}
-            <div class="time no-select" data-created_at="{{message.created_at}}">{{message.created_at}}</div>
-            </div>
-        </div>
+            {% autoescape false %}
+            {{ message.html }}
+            {% endautoescape %}
         {% endfor %}
     </div>
     <chat-window style="display:none" class="chat-area"></chat-window>
     <div class="chat-input">
-      <textarea placeholder="Type a message..." rows="2"></textarea>
-      <upload-button channel="{{channel.channel_uid.value}}"></upload-button>
+        <textarea placeholder="Type a message..." rows="2"></textarea>
+        <upload-button channel="{{ channel.channel_uid.value }}"></upload-button>
     </div>
-    </section>
-    <script>
-        const channelUid = "{{channel.channel_uid.value}}"
+</section>
 
-        function initInputField(textBox){
+<script>
+    const channelUid = "{{ channel.channel_uid.value }}";
 
-            textBox.addEventListener('change', (e) => {
-      e.preventDefault();
-      this.dispatchEvent(new CustomEvent('change', { detail: e.target.value, bubbles: true }));
+    function initInputField(textBox) {
+        textBox.addEventListener('change', (e) => {
+            e.preventDefault();
+            this.dispatchEvent(new CustomEvent('change', { detail: e.target.value, bubbles: true }));
+        });
 
-    });
-
-    textBox.addEventListener('keydown', (e) => {
-      if (e.key === 'Enter' && !e.shiftKey) {
-        e.preventDefault();
-        const message = e.target.value.trim();
-        if (!message) return;
-            app.rpc.sendMessage(channelUid, e.target.value)
-          e.target.value = '';
-      }
-    });
-        }
-        initInputField(document.querySelector("textarea"))
-        function updateTimes(){
-        document.querySelectorAll(".time").forEach((time) => {
-                time.innerText = app.timeDescription(time.dataset.created_at)
-        })
-        }
-        function updateLayout() {
-
-             document.querySelectorAll(".chat-messages").forEach((messages) => messages.scrollTop = messages.scrollHeight + 1000)
-            //document.querySelectorAll(".chat-messages .message:last-child").forEach((message) => message.scrollIntoView({block: "end"}))      
-            updateTimes()
-            let previousUser = null;
-            document.querySelectorAll(".message").forEach((message) => {
-                if(previousUser != message.dataset.user_uid) {
-                    message.classList.add("switch-user")
-                    previousUser = message.dataset.user_uid
-                }else{
-                    message.classList.remove("switch-user")
+        textBox.addEventListener('keydown', (e) => {
+            if (e.key === 'Enter' && !e.shiftKey) {
+                e.preventDefault();
+                const message = e.target.value.trim();
+                if (message) {
+                    app.rpc.sendMessage(channelUid, message);
+                    e.target.value = '';
                 }
-            })
-        }
-         setInterval(() => {
-                
-            
-                updateTimes()
-
-            }, 1000)
-
-        app.addEventListener("channel-message", (data) => {
-            if(data.channel_uid != channelUid) return
-            if(data.username != "{{user.username.value}}"){
-                app.playSound(0)
             }
-            const message = document.createElement("div")
-            //message.classList.add("message")
-            message.dataset.color = data.color
-            message.dataset.created_at = data.created_at
-            message.dataset.user_nick = data.user_nick
-            message.dataset.uid = data.uid
-            message.innerHTML = data.html
-            document.querySelector(".chat-messages").appendChild(message.firstChild)
-            setTimeout(()=>{
-            updateLayout()
-            },50)
-        })
-        updateLayout()
-                //.scrollTop = document.querySelector(".chat-messages").scrollHeight + 5000
-       // })
-    </script>
+        });
+    }
+
+    function updateTimes() {
+        document.querySelectorAll(".time").forEach((time) => {
+            time.innerText = app.timeDescription(time.dataset.created_at);
+        });
+    }
+
+    function updateLayout() {
+        const messagesContainer = document.querySelector(".chat-messages");
+        messagesContainer.scrollTop = messagesContainer.scrollHeight + 1000;
+
+        updateTimes();
+        let previousUser = null;
+        document.querySelectorAll(".message").forEach((message) => {
+            if (previousUser !== message.dataset.user_uid) {
+                message.classList.add("switch-user");
+                previousUser = message.dataset.user_uid;
+            } else {
+                message.classList.remove("switch-user");
+            }
+        });
+    }
+
+    setInterval(updateTimes, 1000);
+
+    app.addEventListener("channel-message", (data) => {
+        if (data.channel_uid !== channelUid) return;
+
+        if (data.username !== "{{ user.username.value }}") {
+            app.playSound(0);
+        }
+
+        const message = document.createElement("div");
+        message.dataset.color = data.color;
+        message.dataset.created_at = data.created_at;
+        message.dataset.user_nick = data.user_nick;
+        message.dataset.uid = data.uid;
+        message.innerHTML = data.html;
+        document.querySelector(".chat-messages").appendChild(message.firstChild);
+        updateLayout();
+    });
+
+    initInputField(document.querySelector("textarea"));
+    updateLayout();
+</script>
 {% endblock %}
+
+