From 1eaf31129c4b92e5699b974b46f8cb2fb0a81c19 Mon Sep 17 00:00:00 2001
From: Kalle <38327916+Sendouc@users.noreply.github.com>
Date: Sun, 25 Feb 2024 11:10:13 +0200
Subject: [PATCH] Fix final standings layout issues

---
 app/features/tournament-bracket/routes/to.$id.brackets.tsx | 4 ++--
 app/features/tournament-bracket/tournament-bracket.css     | 5 +++--
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/app/features/tournament-bracket/routes/to.$id.brackets.tsx b/app/features/tournament-bracket/routes/to.$id.brackets.tsx
index e843e56b1..3a29f613e 100644
--- a/app/features/tournament-bracket/routes/to.$id.brackets.tsx
+++ b/app/features/tournament-bracket/routes/to.$id.brackets.tsx
@@ -526,10 +526,10 @@ function FinalStandings() {
       {nonTopThreePlacements.map((placement) => {
         return (
           <React.Fragment key={placement}>
-            <Divider className="tournament-bracket__stadings__full-row-taker">
+            <Divider className="tournament-bracket__standings__full-row-taker">
               <Placement placement={placement} />
             </Divider>
-            <div className="stack xl horizontal justify-center tournament-bracket__stadings__full-row-taker">
+            <div className="stack xl horizontal flex-wrap justify-center tournament-bracket__standings__full-row-taker">
               {standings
                 .filter((s) => s.placement === placement)
                 .map((standing) => {
diff --git a/app/features/tournament-bracket/tournament-bracket.css b/app/features/tournament-bracket/tournament-bracket.css
index 4d56627b9..b184802c1 100644
--- a/app/features/tournament-bracket/tournament-bracket.css
+++ b/app/features/tournament-bracket/tournament-bracket.css
@@ -340,9 +340,10 @@
   border-radius: var(--rounded);
   padding: var(--s-3);
   gap: var(--s-2);
-  max-width: max-content;
   margin: 0 auto;
   margin-bottom: var(--s-4);
+  width: 100%;
+  max-width: 850px;
 }
 [data-placement="1"] {
   order: -1;
@@ -355,7 +356,7 @@
   .tournament-bracket__standings {
     grid-template-columns: 1fr 1fr 1fr;
   }
-  .tournament-bracket__stadings__full-row-taker {
+  .tournament-bracket__standings__full-row-taker {
     grid-column: 1 / 4;
   }
   [data-placement="1"] {