From 521a24ff68a2b077a19c3c499143db5fa9203be0 Mon Sep 17 00:00:00 2001
From: Daniel Karbach <daniel.karbach@localhorst.tv>
Date: Tue, 15 Mar 2022 21:22:32 +0100
Subject: [PATCH] push scoreboard to the side

---
 resources/js/components/tournament/Detail.js | 60 ++++++++++++--------
 1 file changed, 35 insertions(+), 25 deletions(-)

diff --git a/resources/js/components/tournament/Detail.js b/resources/js/components/tournament/Detail.js
index 1dae1b3..3ce0b48 100644
--- a/resources/js/components/tournament/Detail.js
+++ b/resources/js/components/tournament/Detail.js
@@ -1,6 +1,6 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-import { Button, Container } from 'react-bootstrap';
+import { Button, Col, Container, Row } from 'react-bootstrap';
 import { withTranslation } from 'react-i18next';
 
 import Scoreboard from './Scoreboard';
@@ -17,30 +17,40 @@ const Detail = ({
 	addRound,
 	tournament,
 	user,
-}) => <Container>
-	<div className="d-flex align-items-center justify-content-between">
-		<h1>{tournament.title}</h1>
-		{mayViewProtocol(user, tournament) ?
-			<Protocol id={tournament.id} />
-		: null}
-	</div>
-	<div className="d-flex align-items-center justify-content-between">
-		<h2>{i18n.t('tournaments.scoreboard')}</h2>
-	</div>
-	{tournament.participants ?
-		<Scoreboard tournament={tournament} />
-	: null}
-	<div className="d-flex align-items-center justify-content-between">
-		<h2>{i18n.t('rounds.heading')}</h2>
-		{addRound && mayAddRounds(user, tournament) ?
-			<Button onClick={addRound}>
-				{i18n.t('rounds.new')}
-			</Button>
-		: null}
-	</div>
-	{tournament.rounds ?
-		<Rounds rounds={tournament.rounds} tournament={tournament} />
-	: null}
+}) => <Container fluid>
+	<Row>
+		<Col lg={8} xl={9}>
+			<div className="d-flex align-items-center justify-content-between">
+				<h1>{tournament.title}</h1>
+				{mayViewProtocol(user, tournament) ?
+					<Protocol id={tournament.id} />
+				: null}
+			</div>
+		</Col>
+	</Row>
+	<Row>
+		<Col lg={8} xl={9}>
+			<div className="d-flex align-items-center justify-content-between">
+				<h2>{i18n.t('rounds.heading')}</h2>
+				{addRound && mayAddRounds(user, tournament) ?
+					<Button onClick={addRound}>
+						{i18n.t('rounds.new')}
+					</Button>
+				: null}
+			</div>
+			{tournament.rounds ?
+				<Rounds rounds={tournament.rounds} tournament={tournament} />
+			: null}
+		</Col>
+		<Col lg={4} xl={3}>
+			<div className="d-flex align-items-center justify-content-between">
+				<h2>{i18n.t('tournaments.scoreboard')}</h2>
+			</div>
+			{tournament.participants ?
+				<Scoreboard tournament={tournament} />
+			: null}
+		</Col>
+	</Row>
 </Container>;
 
 Detail.propTypes = {
-- 
2.39.2