From d50768e71920a7f68d93ac513e305a7fd81114b8 Mon Sep 17 00:00:00 2001
From: FloPinguin <25036848+FloPinguin@users.noreply.github.com>
Date: Sun, 22 Feb 2026 17:52:34 +0100
Subject: [PATCH] =?UTF-8?q?Put=20attacks=20display=20above=20events=20on?=
 =?UTF-8?q?=20mobile=20=F0=9F=96=8C=EF=B8=8F=20(#3272)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Description:

tryout wanted that :)


https://github.com/user-attachments/assets/eeaf5447-cffe-4c4f-9734-ebc3edd9255e

## Please complete the following:

- [X] I have added screenshots for all UI updates
- [X] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [X] I have added relevant tests to the test directory
- [X] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced

## Please put your Discord username so you can be contacted if a bug or
regression is found:

FloPinguin

Co-authored-by: Ryan <7389646+ryanbarlow97@users.noreply.github.com>
---
 index.html | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/index.html b/index.html
index 782f25d4c..9a6bbd573 100644
--- a/index.html
+++ b/index.html
@@ -268,16 +268,20 @@
       class="fixed left-0 bottom-0 min-[1200px]:left-4 min-[1200px]:bottom-4 w-full flex flex-col sm:flex-row sm:items-end z-50 pointer-events-none"
     >
       <div
-        class="order-2 sm:order-none w-full sm:w-1/2 min-[1200px]:w-auto lg:max-w-[400px]"
+        class="contents sm:flex sm:flex-col sm:w-1/2 min-[1200px]:w-auto lg:max-w-[400px]"
       >
-        <attacks-display></attacks-display>
-        <control-panel></control-panel>
+        <attacks-display class="order-2 sm:order-none w-full"></attacks-display>
+        <control-panel class="order-4 sm:order-none w-full"></control-panel>
       </div>
       <div
-        class="order-1 sm:order-none w-full sm:flex-1 min-[1200px]:w-auto min-[1200px]:fixed min-[1200px]:right-0 min-[1200px]:bottom-0 flex flex-col sm:items-end pointer-events-none"
+        class="contents sm:flex sm:flex-col sm:flex-1 min-[1200px]:w-auto min-[1200px]:fixed min-[1200px]:right-0 min-[1200px]:bottom-0 sm:items-end pointer-events-none"
       >
-        <chat-display></chat-display>
-        <events-display></events-display>
+        <chat-display
+          class="order-1 sm:order-none w-full sm:w-auto"
+        ></chat-display>
+        <events-display
+          class="order-3 sm:order-none w-full sm:w-auto"
+        ></events-display>
       </div>
     </div>