turniere
/
turniere-frontend
mirror of https://github.com/turniere/turniere-frontend.git
1
0
Fork 0
Code Issues Releases Wiki Activity

Adjust style of the tournament information view

This commit is contained in:
Jonny 2019-05-03 01:07:50 +02:00 committed by JP1998
parent 9fc909e257
commit a38624fd5b
1 changed files with 29 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
js/components/TournamentInformationView.js
View File

@ -6,7 +6,8 @@ import {
Col, Col,
Container, Container,
ListGroup, ListGroup,
ListGroupItem ListGroupItem,
Row
} from 'reactstrap'; } from 'reactstrap';
@ -17,15 +18,18 @@ class PrivateTournamentInformationView extends React.Component {
return ( return (
<Container> <Container>
<Row>
<Col xs="6">
<ButtonsBadge <ButtonsBadge
id={tournament.id} id={tournament.id}
ownerName={tournament.owner_username} ownerName={tournament.owner_username}
isSignedIn={isSignedIn} isSignedIn={isSignedIn}
username={username} username={username}
currentpage={currentpage}/> currentpage={currentpage}
className="pb-3"/>
<p>{tournament.description}</p> <p>{tournament.description}</p>
</Col>
<Col xs="6">
<ListGroup> <ListGroup>
<ListGroupItem> <ListGroupItem>
{tournament.isPublic ? 'Das Turnier ist öffentlich.' : 'Das Turnier ist privat.'} {tournament.isPublic ? 'Das Turnier ist öffentlich.' : 'Das Turnier ist privat.'}
@ -33,6 +37,8 @@ class PrivateTournamentInformationView extends React.Component {
<ListGroupItem>Turnier-Code: <b>{tournament.code}</b></ListGroupItem> <ListGroupItem>Turnier-Code: <b>{tournament.code}</b></ListGroupItem>
<ListGroupItem>von <b>{tournament.owner_username}</b></ListGroupItem> <ListGroupItem>von <b>{tournament.owner_username}</b></ListGroupItem>
</ListGroup> </ListGroup>
</Col>
</Row>
</Container> </Container>
); );
} }
@ -53,21 +59,21 @@ function ButtonsBadge(props) {
switch(currentpage) { switch(currentpage) {
case 'statistics': case 'statistics':
return ( return (
<ButtonGroup> <ButtonGroup className={props.className}>
<EditButton id={id} ownerName={ownerName} isSignedIn={isSignedIn} username={username}/> <EditButton id={id} ownerName={ownerName} isSignedIn={isSignedIn} username={username}/>
<TournamentButton id={id}/> <TournamentButton id={id}/>
</ButtonGroup> </ButtonGroup>
); );
case 'tournament': case 'tournament':
return ( return (
<ButtonGroup> <ButtonGroup className={props.className}>
<EditButton id={id} ownerName={ownerName} isSignedIn={isSignedIn} username={username}/> <EditButton id={id} ownerName={ownerName} isSignedIn={isSignedIn} username={username}/>
<StatisticsButton id={id}/> <StatisticsButton id={id}/>
</ButtonGroup> </ButtonGroup>
); );
case 'edit': case 'edit':
return ( return (
<ButtonGroup> <ButtonGroup className={props.className}>
<StatisticsButton id={id}/> <StatisticsButton id={id}/>
<TournamentButton id={id}/> <TournamentButton id={id}/>
</ButtonGroup> </ButtonGroup>
@ -78,7 +84,7 @@ function ButtonsBadge(props) {
function TournamentButton(props) { function TournamentButton(props) {
const { id } = props; const { id } = props;
return <Button href={'/t/' + id} color='secondary'>Zum Turnier</Button>; return <Button href={'/t/' + id} color='success'>Zum Turnier</Button>;
} }
function EditButton(props) { function EditButton(props) {
@ -86,7 +92,7 @@ function EditButton(props) {
if(isSignedIn && ownerName === username) { if(isSignedIn && ownerName === username) {
return ( return (
<Button href={'/t/' + id + '/edit'} color='secondary'>Turnier bearbeiten</Button> <Button href={'/t/' + id + '/edit'} color='success'>Turnier bearbeiten</Button>
); );
} else { } else {
return null; return null;
@ -95,22 +101,6 @@ function EditButton(props) {
function StatisticsButton(props) { function StatisticsButton(props) {
const { id } = props; const { id } = props;
return <Button href={'/t/' + id + '/statistics'} color='secondary'>Statistiken zum Turnier</Button>; return <Button href={'/t/' + id + '/statistics'} color='success'>Statistiken zum Turnier</Button>;
} }
/*
<Container>
<ButtonsBadge id={id} ownerName={ownerUsername} isSignedIn={isSignedIn} username={username}/>
<p>{description}</p>
<ListGroup>
<ListGroupItem>
{isPublic ? 'Das Turnier ist öffentlich.' : 'Das Turnier ist privat.'}
</ListGroupItem>
<ListGroupItem>Turnier-Code: <b>{code}</b></ListGroupItem>
<ListGroupItem>von <b>{ownerUsername}</b></ListGroupItem>
</ListGroup>
</Container>
*/