Format every js file to comply with the new eslint rules

js/components/EditableStringList.js

@@ -1,13 +1,6 @@
 import React from 'react';
 import {
-    Alert,
+    Alert, Button, Card, CardBody, CardTitle, Input, InputGroup, InputGroupAddon
-    Button,
-    Card,
-    CardBody,
-    CardTitle,
-    Input,
-    InputGroup,
-    InputGroupAddon
 } from 'reactstrap';
 
 import '../../static/css/editablestringlist.css';
@@ -16,9 +9,7 @@ export default class EditableStringList extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
-            groupSize: props.groupSize,
+            groupSize: props.groupSize, teams: props.teams, groups: props.groups
-            teams: props.teams,
-            groups: props.groups
         };
         this.add = this.add.bind(this);
         this.remove = this.remove.bind(this);
@@ -39,8 +30,7 @@ export default class EditableStringList extends React.Component {
         lastGroup[lastGroup.length] = text;
 
         this.setState({
-            teams: this.state.teams,
+            teams: this.state.teams, groups: this.state.groups
-            groups: this.state.groups
         });
 
         this.props.onTeamsChange(this.state.teams);
@@ -55,8 +45,7 @@ export default class EditableStringList extends React.Component {
         }
 
         this.setState({
-            teams: this.state.teams,
+            teams: this.state.teams, groups: this.state.groups
-            groups: this.state.groups
         });
 
         this.props.onTeamsChange(this.state.teams);
@@ -91,8 +80,7 @@ export default class EditableStringList extends React.Component {
             for (let team = 0; team < this.state.groups[group].length; team++) {
                 if (this.state.groups[group][team] === text) {
                     return {
-                        group: group,
+                        group: group, team: team
-                        team: team
                     };
                 }
             }
@@ -120,8 +108,7 @@ export default class EditableStringList extends React.Component {
         }
 
         this.setState({
-            groupSize: newSize,
+            groupSize: newSize, groups: rearrangedGroups
-            groups: rearrangedGroups
         });
         this.props.onGroupsChange(this.state.groups);
     }
@@ -148,35 +135,32 @@ export default class EditableStringList extends React.Component {
 
         if (this.props.groupPhaseEnabled) {
             if ((typeof this.state.teams !== 'undefined') && this.state.teams.length > 0) {
-                return (
+                return (<div className="bg-light p-3 text-secondary font-italic">
-                    <div className="bg-light p-3 text-secondary font-italic">
+                    <StringInput submit={this.add} placeholder={this.props.inputPlaceholder}
-                        <StringInput submit={this.add} placeholder={this.props.inputPlaceholder} addButtonText={this.props.addButtonText}/>
+                        addButtonText={this.props.addButtonText}/>
-                        <GroupView groups={this.state.groups} removeTeam={this.remove} onGroupSwitched={this.onGroupSwitch}/>
+                    <GroupView groups={this.state.groups} removeTeam={this.remove}
-                    </div>
+                        onGroupSwitched={this.onGroupSwitch}/>
-                );
+                </div>);
             } else {
-                return (
+                return (<div className="bg-light p-3 text-secondary text-center font-italic">
-                    <div className="bg-light p-3 text-secondary text-center font-italic">
+                    <StringInput submit={this.add} placeholder={this.props.inputPlaceholder}
-                        <StringInput submit={this.add} placeholder={this.props.inputPlaceholder} addButtonText={this.props.addButtonText}/>
+                        addButtonText={this.props.addButtonText}/>
                     {this.props.groupPlaceHolder}
-                    </div>
+                </div>);
-                );
             }
         } else {
             if ((typeof this.state.teams !== 'undefined') && this.state.teams.length > 0) {
-                return (
+                return (<div className="bg-light p-3 text-secondary font-italic">
-                    <div className="bg-light p-3 text-secondary font-italic">
+                    <StringInput submit={this.add} placeholder={this.props.inputPlaceholder}
-                        <StringInput submit={this.add} placeholder={this.props.inputPlaceholder} addButtonText={this.props.addButtonText}/>
+                        addButtonText={this.props.addButtonText}/>
                     {this.state.teams.map(text => <Item text={text} key={text} removeItem={this.remove}/>)}
-                    </div>
+                </div>);
-                );
             } else {
-                return (
+                return (<div className="bg-light p-3 text-secondary text-center font-italic">
-                    <div className="bg-light p-3 text-secondary text-center font-italic">
+                    <StringInput submit={this.add} placeholder={this.props.inputPlaceholder}
-                        <StringInput submit={this.add} placeholder={this.props.inputPlaceholder} addButtonText={this.props.addButtonText}/>
+                        addButtonText={this.props.addButtonText}/>
                     {this.props.teamPlaceholder}
-                    </div>
+                </div>);
-                );
             }
         }
     }
@@ -188,14 +172,11 @@ class GroupView extends React.Component {
     }
 
     render() {
-        return (
+        return (<div>
-            <div>
+            {this.props.groups.map((group, groupindex) => (<Card className="group-card" key={groupindex}>
-                {this.props.groups.map((group, groupindex) => (
-                    <Card className="group-card" key={groupindex}>
                 <CardBody>
                     <CardTitle>Group {groupindex + 1}</CardTitle>
-                            {group.map((team, teamindex) => (
+                    {group.map((team, teamindex) => (<div key={team} draggable droppable="droppable"
-                                <div key={team} draggable droppable="droppable"
                         className="grouped-team-item"
                         onDragStart={e => this.onDragStart(e, groupindex, teamindex)}
                         onDragOver={e => this.onDragOver(e)}
@@ -203,23 +184,16 @@ class GroupView extends React.Component {
 
                         <Item text={team} removeItem={this.props.removeTeam}/>
 
-                                </div>
+                    </div>))}
-                            ))}
                 </CardBody>
-                    </Card>
+            </Card>))}
-                ))}
+        </div>);
-            </div>
-        );
     }
 
     onDragStart(e, group, team) {
-        e.dataTransfer.setData(
+        e.dataTransfer.setData('text/plain', JSON.stringify({
-            'text/plain',
+            group: group, team: team
-            JSON.stringify({
+        }));
-                group: group,
-                team: team
-            })
-        );
     }
 
     onDragOver(e) {
@@ -231,8 +205,7 @@ class GroupView extends React.Component {
 
         const src = JSON.parse(e.dataTransfer.getData('text'));
         const dest = {
-            group: group,
+            group: group, team: team
-            team: team
         };
 
         this.props.onGroupSwitched(src, dest);
@@ -252,9 +225,9 @@ class StringInput extends React.Component {
     }
 
     render() {
-        return (
+        return (<InputGroup className="mb-3">
-            <InputGroup className="mb-3">
+            <Input placeholder={this.props.placeholder} type="text" size="255" value={this.state.value} required
-                <Input placeholder={this.props.placeholder} type="text" size="255" value={this.state.value} required onChange={this.handleChange} onKeyPress={e => {
+                onChange={this.handleChange} onKeyPress={e => {
                     if (e.key === 'Enter') {
                         this.submit();
                         return false;
@@ -264,8 +237,7 @@ class StringInput extends React.Component {
                 <Button color="success" outline={true}
                     onClick={() => this.submit()}>{this.props.addButtonText}</Button>
             </InputGroupAddon>
-            </InputGroup>
+        </InputGroup>);
-        );
     }
 
     submit() {
@@ -290,10 +262,8 @@ class Item extends React.Component {
     }
 
     render() {
-        return (
+        return (<Alert className="team-item m-2" color="info" isOpen={this.state.visible} toggle={this.onDismiss}>
-            <Alert className="team-item m-2" color="info" isOpen={this.state.visible} toggle={this.onDismiss}>
             {this.props.text}
-            </Alert>
+        </Alert>);
-        );
     }
 }

js/components/Login.js

@@ -9,8 +9,7 @@ import '../../static/css/errormessages.css';
 import {notify} from 'react-notify-toast';
 
 export function Login(props) {
-    return (
+    return (<Container className="py-5">
-        <Container className="py-5">
         <Card className="shadow">
             <CardBody>
                 <h1 className="custom-font">Login</h1>
@@ -22,24 +21,18 @@ export function Login(props) {
                 </div>
             </CardBody>
         </Card>
-        </Container>
+    </Container>);
-    );
 }
 
 class LoginErrorList extends React.Component {
     render() {
         const {error, errorMessages} = this.props;
         if (error) {
-            return (
+            return (<ul className='mt-3 error-box'>
-                <ul className='mt-3 error-box'>
+                {errorMessages.map((message, index) => <li key={index}>
-                    { errorMessages.map((message, index) =>
-                        <li key={index}>
                     {message}
-                        </li>
+                </li>)}
-
+            </ul>);
-                    ) }
-                </ul>
-            );
         } else {
             return null;
         }
@@ -51,9 +44,7 @@ const mapStateToErrorMessages = state => {
     return {errorMessages, error};
 };
 
-const VisibleLoginErrorList = connect(
+const VisibleLoginErrorList = connect(mapStateToErrorMessages)(LoginErrorList);
-    mapStateToErrorMessages
-)(LoginErrorList);
 
 class LoginSuccessRedirectComponent extends React.Component {
     render() {
@@ -76,32 +67,32 @@ class LoginForm extends React.Component {
         super(props);
 
         this.state = {
-            email: '',
+            email: '', password: ''
-            password: ''
         };
     }
 
     tryLogin(event) {
         event.preventDefault();
-        login(this.state.email, this.state.password, username => notify.show('Willkommen, ' + username + '!', 'success', 2500));
+        login(this.state.email, this.state.password,
+            username => notify.show('Willkommen, ' + username + '!', 'success', 2500));
     }
 
     render() {
-        return (
+        return (<Form onSubmit={this.tryLogin.bind(this)}>
-            <Form onSubmit={this.tryLogin.bind(this)}>
             <FormGroup>
                 <Label for="username">E-Mail-Adresse</Label>
-                    <Input type="email" name="username" value={this.state.email} onChange={ this.handleEmailInput.bind(this) } />
+                <Input type="email" name="username" value={this.state.email}
+                    onChange={this.handleEmailInput.bind(this)}/>
             </FormGroup>
             <FormGroup>
                 <Label for="password">Passwort</Label>
-                    <Input type="password" name="password" value={this.state.password} onChange={ this.handlePasswordInput.bind(this) } />
+                <Input type="password" name="password" value={this.state.password}
+                    onChange={this.handlePasswordInput.bind(this)}/>
             </FormGroup>
             <input type="submit" className="btn btn-lg btn-success w-100 shadow-sm" value="Anmelden"/>
             <VisibleLoginErrorList/>
             <LoginSuccessRedirect/>
-            </Form>
+        </Form>);
-        );
     }
 
     handlePasswordInput(input) {
@@ -115,9 +106,7 @@ class LoginForm extends React.Component {
 
 function Hint(props) {
     if (props.hint != null) {
-        return (
+        return (<h3>{props.hint}</h3>);
-            <h3>{ props.hint }</h3>
-        );
     } else {
         return null;
     }

js/components/Navigation.js

@@ -1,14 +1,5 @@
 import {
-    Badge,
+    Badge, Button, ButtonGroup, Collapse, Nav, Navbar, NavbarBrand, NavbarToggler, NavItem, NavLink
-    Button,
-    ButtonGroup,
-    Collapse,
-    Nav,
-    Navbar,
-    NavbarBrand,
-    NavbarToggler,
-    NavItem,
-    NavLink
 } from 'reactstrap';
 import {connect} from 'react-redux';
 import React from 'react';
@@ -34,26 +25,22 @@ export class TurniereNavigation extends React.Component {
     }
 
     render() {
-        return (
+        return (<Navbar color="light" light expand="lg">
-            <Navbar color="light" light expand="lg">
             <NavbarBrand href="/">turnie.re</NavbarBrand>
             <Betabadge/>
-                <NavbarToggler onClick={this.toggle} />
+            <NavbarToggler onClick={this.toggle}/>
             <Collapse isOpen={!this.state.collapsed} navbar>
                 <NavLinks/>
                 <LoginLogoutButtons/>
             </Collapse>
-            </Navbar>
+        </Navbar>);
-        );
     }
 }
 
 function Navlink(props) {
-    return (
+    return (<NavItem active={true}>
-        <NavItem active={true}>
         <NavLink href={props.target}>{props.text}</NavLink>
-        </NavItem>
+    </NavItem>);
-    );
 }
 
 class SmartNavLinks extends React.Component {
@@ -80,19 +67,19 @@ class InvisibleLoginLogoutButtons extends React.Component {
         const {isSignedIn, username} = this.props;
 
         if (isSignedIn) {
-            return (
+            return (<ButtonGroup className="nav-item">
-                <ButtonGroup className="nav-item">
+                <Button outline color="success" href="/profile"
-                    <Button outline color="success" href="/profile" className="navbar-btn my-2 my-sm-0 px-5">{ username }</Button>
+                    className="navbar-btn my-2 my-sm-0 px-5">{username}</Button>
-                    <Button outline color="success" onClick={this.logout.bind(this)} className="navbar-btn my-2 my-sm-0 px-5">Logout</Button>
+                <Button outline color="success" onClick={this.logout.bind(this)}
-                </ButtonGroup>
+                    className="navbar-btn my-2 my-sm-0 px-5">Logout</Button>
-            );
+            </ButtonGroup>);
         } else {
-            return (
+            return (<ButtonGroup className="nav-item">
-                <ButtonGroup className="nav-item">
+                <Button outline color="success" href="/login"
-                    <Button outline color="success" href="/login" className="navbar-btn my-2 my-sm-0 px-5">Login</Button>
+                    className="navbar-btn my-2 my-sm-0 px-5">Login</Button>
-                    <Button outline color="success" href="/register" className="navbar-btn my-2 my-sm-0 px-5">Registrieren</Button>
+                <Button outline color="success" href="/register"
-                </ButtonGroup>
+                    className="navbar-btn my-2 my-sm-0 px-5">Registrieren</Button>
-            );
+            </ButtonGroup>);
         }
     }
 }
@@ -102,10 +89,6 @@ const mapStateToUserinfo = state => {
     return {isSignedIn, username};
 };
 
-const LoginLogoutButtons = connect(
+const LoginLogoutButtons = connect(mapStateToUserinfo)(InvisibleLoginLogoutButtons);
-    mapStateToUserinfo
-)(InvisibleLoginLogoutButtons);
 
-const NavLinks = connect(
+const NavLinks = connect(mapStateToUserinfo)(SmartNavLinks);
-    mapStateToUserinfo
-)(SmartNavLinks);

pages/_app.js

@@ -14,15 +14,13 @@ class TurniereApp extends App {
 
     render() {
         const {Component, pageProps, reduxStore} = this.props;
-        return (
+        return (<Container>
-            <Container>
+            <Notifications/>
-                <Notifications />
             <Favicon url="../static/icons/favicon.ico"/>
             <Provider store={reduxStore}>
                 <Component {...pageProps} />
             </Provider>
-            </Container>
+        </Container>);
-        );
     }
 }
 

pages/_error.js

@@ -14,8 +14,6 @@ export default class Error extends React.Component {
     }
 
     render() {
-        return (
+        return (<ErrorPageComponent statusCode={this.props.statusCode}/>);
-            <ErrorPageComponent statusCode={this.props.statusCode}/>
-        );
     }
 }

pages/create.js

@@ -5,15 +5,7 @@ import {connect} from 'react-redux';
 import posed from 'react-pose';
 
 import {
-    Button,
+    Button, Card, CardBody, Container, CustomInput, Form, FormGroup, Input, Label
-    Card,
-    CardBody,
-    Container,
-    CustomInput,
-    Form,
-    FormGroup,
-    Input,
-    Label
 } from 'reactstrap';
 
 import {TurniereNavigation} from '../js/components/Navigation';
@@ -29,8 +21,7 @@ class CreatePage extends React.Component {
     render() {
         const {isSignedIn} = this.props;
 
-        return (
+        return (<UserRestrictor>
-            <UserRestrictor>
             <Option condition={isSignedIn}>
                 <div className="main generic-fullpage-bg">
                     <Head>
@@ -55,8 +46,7 @@ class CreatePage extends React.Component {
                     <Footer/>
                 </div>
             </Option>
-            </UserRestrictor>
+        </UserRestrictor>);
-        );
     }
 }
 
@@ -65,31 +55,24 @@ function mapStateToCreatePageProperties(state) {
     return {isSignedIn};
 }
 
-export default connect(
+export default connect(mapStateToCreatePageProperties)(CreatePage);
-    mapStateToCreatePageProperties
-)(CreatePage);
 
 function CreateTournamentCard() {
-    return (
+    return (<Container className="py-5">
-        <Container className="py-5">
         <Card className="shadow">
             <CardBody>
                 <h1 className="custom-font">Turnier erstellen</h1>
                 <CreateTournamentForm/>
             </CardBody>
         </Card>
-        </Container>
+    </Container>);
-    );
 }
 
 const GroupphaseFader = posed.div({
     visible: {
-        opacity: 1,
+        opacity: 1, height: 150
-        height: 150
+    }, hidden: {
-    },
+        opacity: 0, height: 0
-    hidden: {
-        opacity: 0,
-        height: 0
     }
 });
 
@@ -99,14 +82,9 @@ class CreateTournamentForm extends React.Component {
         this.state = {
             groupPhaseEnabled: false,
 
-            name: '',
+            name: '', description: '', public: false,
-            description: '',
-            public: false,
 
-            groupSize: 4,
+            groupSize: 4, groupAdvance: 1, teams: [], groups: []
-            groupAdvance: 1,
-            teams: [],
-            groups: []
         };
         this.handleGroupPhaseEnabledInput = this.handleGroupPhaseEnabledInput.bind(this);
         this.teamListUpdate = this.teamListUpdate.bind(this);
@@ -122,25 +100,29 @@ class CreateTournamentForm extends React.Component {
     }
 
     render() {
-        return (
+        return (<div>
-            <div>
             <Form>
                 <FormGroup>
                     <Label for="name">Name des Turniers</Label>
-                        <Input type="text" name="name" size="255" required value={this.state.name} onChange={this.handleNameInput}/>
+                    <Input type="text" name="name" size="255" required value={this.state.name}
+                        onChange={this.handleNameInput}/>
                 </FormGroup>
                 <FormGroup>
                     <Label for="description">Beschreibung (optional)</Label>
-                        <Input type="text" name="description" size="255" value={this.state.description} onChange={this.handleDescriptionInput}/>
+                    <Input type="text" name="description" size="255" value={this.state.description}
+                        onChange={this.handleDescriptionInput}/>
                 </FormGroup>
                 <FormGroup>
                     <CustomInput type="checkbox" id="public"
-                            label="Turnier öffentlich anzeigen (schreibgeschützt)" checked={this.state.public} onChange={this.handlePublicInput}/>
+                        label="Turnier öffentlich anzeigen (schreibgeschützt)" checked={this.state.public}
+                        onChange={this.handlePublicInput}/>
                     <CustomInput type="checkbox" id="mix-teams" label="Teams mischen"/>
                     <CustomInput type="checkbox" id="group-phase" label="Gruppenphase"
-                            checked={this.state.groupPhaseEnabled} onChange={this.handleGroupPhaseEnabledInput}/>
+                        checked={this.state.groupPhaseEnabled}
+                        onChange={this.handleGroupPhaseEnabledInput}/>
                 </FormGroup>
-                    <GroupphaseFader pose={this.state.groupPhaseEnabled? 'visible' : 'hidden'} className="groupphasefader">
+                <GroupphaseFader pose={this.state.groupPhaseEnabled ? 'visible' : 'hidden'}
+                    className="groupphasefader">
                     <FormGroup>
                         <Label for="teams-per-group">Anzahl Teams pro Gruppe</Label>
                         <Input type="number" name="teams-per-group" min="3"
@@ -166,9 +148,9 @@ class CreateTournamentForm extends React.Component {
                 onTeamsChange={this.teamListUpdate}
                 onGroupsChange={this.groupListUpdate}
                 inputPlaceholder="Teamname"/>
-                <Button color="success" size="lg" className="w-100 shadow-sm mt-4" onClick={this.create}>Turnier erstellen</Button>
+            <Button color="success" size="lg" className="w-100 shadow-sm mt-4" onClick={this.create}>Turnier
-            </div>
+                    erstellen</Button>
-        );
+        </div>);
     }
 
     teamListUpdate(list) {
@@ -183,8 +165,7 @@ class CreateTournamentForm extends React.Component {
         const newSize = input.target.value;
         if (newSize <= this.state.groupAdvance) {
             this.setState({
-                groupSize: newSize,
+                groupSize: newSize, groupAdvance: newSize - 1
-                groupAdvance: newSize - 1
             });
         } else {
             this.setState({groupSize: newSize});
@@ -249,8 +230,7 @@ function createTeamArray(groupphase, groups, teams) {
         for (let groupNumber = 0; groupNumber < groups.length; groupNumber++) {
             for (let groupMember = 0; groupMember < groups[groupNumber].length; groupMember++) {
                 result[result.length] = {
-                    'name': groups[groupNumber][groupMember],
+                    'name': groups[groupNumber][groupMember], 'group': groupNumber
-                    'group': groupNumber
                 };
             }
         }

pages/faq.js

@@ -11,8 +11,7 @@ import 'bootstrap/dist/css/bootstrap.min.css';
 import '../static/everypage.css';
 
 function Main() {
-    return (
+    return (<div className="main">
-        <div className="main">
         <Container className="pb-5">
             <GeneralFaq/>
             <hr className="mb-5"/>
@@ -20,13 +19,11 @@ function Main() {
             <hr className="mb-5"/>
             <TournamentFaq/>
         </Container>
-        </div>
+    </div>);
-    );
 }
 
 function GeneralFaq() {
-    return (
+    return (<div className="running-text">
-        <div className="running-text">
         <h1>Allgemein</h1>
         <Row>
             <Col sm="4">
@@ -34,97 +31,83 @@ function GeneralFaq() {
                 <p>
                     turnie.re ist ein Online-Turnier&shy;planer.</p>
                 <p>
-                        Allein aus den Team-Namen berechnen wir dir einen kompletten Spielplan, den du auch gleich
+                    Allein aus den Team-Namen berechnen wir dir einen kompletten Spielplan, den du auch gleich mit allen
-                        mit allen Leuten teilen kannst, ohne dir Gedanken machen zu müssen, wer gegen wen spielen
+                    Leuten teilen kannst, ohne dir Gedanken machen zu müssen, wer gegen wen spielen muss. Du trägst ein,
-                        muss. Du trägst ein, wer gewonnen hat, und turnie.re sagt, wer als nächstes spielt.
+                    wer gewonnen hat, und turnie.re sagt, wer als nächstes spielt. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4>Für welche Sportarten ist turnie.re geeignet?</h4>
                 <p>
-                        turnie.re ist prinzipiell für jede Sportart geeignet. Die einzige Vor&shy;aus&shy;setzung ist, dass
+                    turnie.re ist prinzipiell für jede Sportart geeignet. Die einzige Vor&shy;aus&shy;setzung ist,
-                        in jedem Spiel zwei Mannschaften oder Spieler gegeinander antreten und dass derjenige mit
+                    dass in jedem Spiel zwei Mannschaften oder Spieler gegeinander antreten und dass derjenige mit den
-                        den meisten Punkten gewinnt.
+                    meisten Punkten gewinnt. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4>Für welche Anzahl an Teams ist turnie.re geeignet?</h4>
                 <p>
-                        turnie.re ist unabhängig von der Anzahl der Teams nutzbar.
+                    turnie.re ist unabhängig von der Anzahl der Teams nutzbar. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4>Fallen für die Nutzung von turnie.re Kosten an?</h4>
                 <p>
                     turnie.re ist ein kostenloser Service! Wir erheben keine Kosten und sind nur darauf aus,
-                        dein Turnier-Management so einfach wie möglich zu gestalten.
+                    dein Turnier-Management so einfach wie möglich zu gestalten. </p>
-                    </p>
             </Col>
         </Row>
-        </div>
+    </div>);
-    );
 }
 
 function AccountFaq() {
-    return (
+    return (<div className="running-text">
-        <div className="running-text">
         <h1>Account</h1>
         <Row>
             <Col sm="4">
                 <h4>Warum brauche ich einen Account für turnie.re?</h4>
                 <p>
-                        Wir wollen sicherstellen, dass nur berechtigte Nutzer Turnierdaten ändern können. Damit wir
+                    Wir wollen sicherstellen, dass nur berechtigte Nutzer Turnierdaten ändern können. Damit wir dich als
-                        dich als berechtigt verifizieren können, benötigst du einen Acoount, sodass wir dir die
+                    berechtigt verifizieren können, benötigst du einen Acoount, sodass wir dir die entsprechenden
-                        entsprechenden Bearbeitungsrechte zuteilen können.
+                    Bearbeitungsrechte zuteilen können. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4>Welche Daten muss ich bei der Accounterstellung angeben?</h4>
                 <p>
-                        Um einen Account anzulegen musst du einen Nutzernamen, eine gültige E-Mailadresse sowie ein
+                    Um einen Account anzulegen musst du einen Nutzernamen, eine gültige E-Mailadresse sowie ein Passwort
-                        Passwort angeben.
+                    angeben. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4>Wie werden meine Daten verarbeitet?</h4>
                 <p>
-                        Deine Daten werden in unserer Datenbank gespeichert. Eine Weitergabe dieser Daten an Dritte
+                    Deine Daten werden in unserer Datenbank gespeichert. Eine Weitergabe dieser Daten an Dritte erfolgt
-                        erfolgt nicht!
+                    nicht!
                 </p>
                 <p>
-                        Zusätlich wird dein Passwort verschlüsselt gespeichert, das bedeutet auch wir kennen dein
+                    Zusätlich wird dein Passwort verschlüsselt gespeichert, das bedeutet auch wir kennen dein Passwort
-                        Passwort nicht und dein Account wird zuverlässig geschützt.
+                    nicht und dein Account wird zuverlässig geschützt. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4>Wie kann ich meinen Nutzernamen ändern?</h4>
                 <p>
-                        Über deinen Nutzernamen, der in der Kopfzeile angezeigt wird, gelangst du auf deine
+                    Über deinen Nutzernamen, der in der Kopfzeile angezeigt wird, gelangst du auf deine Profilseite.
-                        Profilseite. Hier kannst du deinen Nutzernamen ändern.
+                    Hier kannst du deinen Nutzernamen ändern. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4>Wie kann ich meine E-Mailadresse ändern?</h4>
                 <p>
-                        Über deinen Nutzernamen, der in der Kopfzeile angezeigt wird, gelangst du auf deine
+                    Über deinen Nutzernamen, der in der Kopfzeile angezeigt wird, gelangst du auf deine Profilseite.
-                        Profilseite. Hier kannst du deine E-Mailadresse ändern ändern.
+                    Hier kannst du deine E-Mailadresse ändern ändern. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4>Wie kann ich mein Passwort ändern?</h4>
                 <p>
-                        Auf deiner Profilseite findest du einen "Passwort ändern" Button. Auf der sich dann
+                    Auf deiner Profilseite findest du einen "Passwort ändern" Button. Auf der sich dann öffnenden Seite
-                        öffnenden Seite kannst du dein Passwort ändern.
+                    kannst du dein Passwort ändern. </p>
-                    </p>
             </Col>
         </Row>
-        </div>
+    </div>);
-    );
 }
 
 function TournamentFaq() {
-    return (
+    return (<div className="running-text">
-        <div className="running-text">
         <h1>Turnier</h1>
         <Row>
             <Col sm="4">
@@ -132,99 +115,85 @@ function TournamentFaq() {
                 <p>
                     Um ein Turnier zu erstellen musst du dich zuerst anmelden.</p>
                 <p>
-                        Über "Turnier erstellen" gelangst du auf die "Turnier erstellen" Seite. Auf dieser kannst du
+                    Über "Turnier erstellen" gelangst du auf die "Turnier erstellen" Seite. Auf dieser kannst du deinem
-                        deinem Turnier einen Namen geben und eine (optionale) Beschreibung hinzufügen. Dann kannst
+                    Turnier einen Namen geben und eine (optionale) Beschreibung hinzufügen. Dann kannst du dein
-                        du dein Turnier <a href="#public-tournament">öffentlich oder privat</a> erstellen, die Teams
+                    Turnier <a href="#public-tournament">öffentlich oder privat</a> erstellen, die Teams für die
-                        für die Spielpaarungen <a href="#randomize-teams">mischen</a> lassen und eine <a href="#groupstage">Gruppenphase</a>
+                    Spielpaarungen <a href="#randomize-teams">mischen</a> lassen und eine <a
-                        hinzufügen. Im Feld "Teams" kannst du die
+                        href="#groupstage">Gruppenphase</a>
-                        teilnehmenden <a href="#add-teams">Teams
+                    hinzufügen. Im Feld "Teams" kannst du die teilnehmenden <a href="#add-teams">Teams eintragen</a> und
-                        eintragen</a> und hinzufügen. </p>
+                    hinzufügen. </p>
                 <p>
-                        Wenn du die Option Gruppenphase aktiviert hast, kannst du zusätzlich noch die Größe der
+                    Wenn du die Option Gruppenphase aktiviert hast, kannst du zusätzlich noch die Größe der Gruppen
-                        Gruppen angeben.
+                    angeben. </p>
-                    </p>
             </Col>
             <Col sm="4">
-                    <h4 id="public-tournament">Was ist der Unterschied zwischen einem öffentlichen und einem
+                <h4 id="public-tournament">Was ist der Unterschied zwischen einem öffentlichen und einem privaten
-                        privaten Turnier?</h4>
+                    Turnier?</h4>
                 <p>
-                        Standardmäßig ist ein Turnier privat, das bedeutet, dass nur der Turnierersteller und
+                    Standardmäßig ist ein Turnier privat, das bedeutet, dass nur der Turnierersteller und Zuschauer, die
-                        Zuschauer, die den entsprechenden Turniercode erhalten haben, das Turnier, seine
+                    den entsprechenden Turniercode erhalten haben, das Turnier, seine teilnehmenden Mannschaften, sowie
-                        teilnehmenden Mannschaften, sowie die Spielpaarungen und die jeweiligen Spielstände sehen
+                    die Spielpaarungen und die jeweiligen Spielstände sehen können. </p>
-                        können.
-                    </p>
                 <p>
-                        Wenn du dich entscheidest dein Turnier öffentlich zu erstellen, wird der Turniercode nicht
+                    Wenn du dich entscheidest dein Turnier öffentlich zu erstellen, wird der Turniercode nicht mehr
-                        mehr benötigt, um das Turnier und all seine Informationen einzusehen. Das Turnier wird dann
+                    benötigt, um das Turnier und all seine Informationen einzusehen. Das Turnier wird dann in der Liste
-                        in der Liste der öffentlichen Turniere angezeigt und kann auch über seinen Namen von jedem
+                    der öffentlichen Turniere angezeigt und kann auch über seinen Namen von jedem gefunden werden. </p>
-                        gefunden werden. </p>
                 <p>
-                        Trotzdem bleibt der Turnierersteller der Einzige, der die Turnierinformationen bearbeiten
+                    Trotzdem bleibt der Turnierersteller der Einzige, der die Turnierinformationen bearbeiten und
-                        und Spielstände eintragen kann.
+                    Spielstände eintragen kann. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4 id="randomize-teams">Was bedeutet "Teams mischen"?</h4>
                 <p>
-                        Die Spielpaarungen werden anhand der Eingabereihenfolge der Teams erstellt. So spielt z.B.
+                    Die Spielpaarungen werden anhand der Eingabereihenfolge der Teams erstellt. So spielt z.B. das
-                        das zuerst eingegebene Team gegen das als zweites eingegebene Team, das als drittes
+                    zuerst eingegebene Team gegen das als zweites eingegebene Team, das als drittes eingegebene gegen
-                        eingegebene gegen das als viertes eingegebene, und so weiter. </p>
+                    das als viertes eingegebene, und so weiter. </p>
                 <p>
-                        Wenn du das nicht möchtest kannst du die Option "Teams mischen" aktivieren und die
+                    Wenn du das nicht möchtest kannst du die Option "Teams mischen" aktivieren und die Spielpaarungen
-                        Spielpaarungen werden in einer zufälligen Reihenfolge erstellt.
+                    werden in einer zufälligen Reihenfolge erstellt. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4 id="groupstage">Was passiert wenn ich die Gruppenphase aktiviere?</h4>
                 <p>
                     Grundsätzlich erstellt turnie.re dir einen Spielplan für ein Turnier <strong>ohne</strong>
-                        Gruppenphase und <strong>nur</strong> einer K.O.-Phase. Wenn du eine Gruppenphase spielen
+                    Gruppenphase und <strong>nur</strong> einer K.O.-Phase. Wenn du eine Gruppenphase spielen lassen
-                        lassen willst, kannst du das aber auch tun. Wenn die Gruppenphase aktiviert ist, werden
+                    willst, kannst du das aber auch tun. Wenn die Gruppenphase aktiviert ist, werden deine eingegeben
-                        deine eingegeben Teams automatisch in Gruppen eingeteilt und auch die Spielpläne für die
+                    Teams automatisch in Gruppen eingeteilt und auch die Spielpläne für die einzelnen Gruppen berechnet.
-                        einzelnen Gruppen berechnet. </p>
-                    <p>
-                        Bitte beachte, dass die Anzahl der Teams durch die Gruppengröße teilbar sein muss.
                 </p>
+                <p>
+                    Bitte beachte, dass die Anzahl der Teams durch die Gruppengröße teilbar sein muss. </p>
             </Col>
             <Col sm="4">
                 <h4 id="add-teams">Wie kann ich Teams hinzufügen?</h4>
                 <p>
                     Auf der "Turnier erstellen" Seite kannst du im Feld "Teams" deine Teams eintragen. </p>
                 <p>
-                        Du kannst die Teamnamen einzeln eingeben und dann über drücken der Entertaste oder über den
+                    Du kannst die Teamnamen einzeln eingeben und dann über drücken der Entertaste oder über den Button
-                        Button "Team hinzufügen" das Team deinem Turnier hinzufügen. Du kannst aber auch deine Teams
+                    "Team hinzufügen" das Team deinem Turnier hinzufügen. Du kannst aber auch deine Teams als eine mit
-                        als eine mit Kommas getrennte Liste eingeben und dann hinzufügen.
+                    Kommas getrennte Liste eingeben und dann hinzufügen. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4>Wie starte ich ein Spiel?</h4>
                 <p>
-                        Auf der Turnierübersicht Seite gibt es für jede Partie einen "Spiel starten" Button. Über
+                    Auf der Turnierübersicht Seite gibt es für jede Partie einen "Spiel starten" Button. Über diesen
-                        diesen kannst du einfach das jeweilige Spiel starten.
+                    kannst du einfach das jeweilige Spiel starten. </p>
-                    </p>
             </Col>
             <Col sm="4">
                 <h4>Wie trage ich einen Spielstand für eine Partie ein?</h4>
                 <p>
-                        Auf der Turnierübersicht Seite gibt es für jede Partie einen "Spielstand ändern" Button.
+                    Auf der Turnierübersicht Seite gibt es für jede Partie einen "Spielstand ändern" Button. Über diesen
-                        Über diesen kannst du einfach den Spielstand eintragen. In dem Popup, das sich öffnet kannst
+                    kannst du einfach den Spielstand eintragen. In dem Popup, das sich öffnet kannst du den aktuellen
-                        du den aktuellen Spielstand eintragen und angeben, ob das Spiel noch läuft oder schon
+                    Spielstand eintragen und angeben, ob das Spiel noch läuft oder schon beendet ist. </p>
-                        beendet ist.
-                    </p>
                 <h4>Gibt es in der Gruppenphase eine Blitztabelle?</h4>
                 <p>
-                        Ja, die in der Gruppenphase dargestellte Tabelle stellt eine Blitztabelle dar.
+                    Ja, die in der Gruppenphase dargestellte Tabelle stellt eine Blitztabelle dar. </p>
-                    </p>
             </Col>
         </Row>
-        </div>
+    </div>);
-    );
 }
 
 export default class FaqPage extends React.Component {
     render() {
-        return (
+        return (<div>
-            <div>
             <Head>
                 <title>FAQ: turnie.re</title>
             </Head>
@@ -232,7 +201,6 @@ export default class FaqPage extends React.Component {
             <BigImage text="FAQ"/>
             <Main/>
             <Footer/>
-            </div>
+        </div>);
-        );
     }
 }

pages/imprint.js

@@ -10,16 +10,13 @@ import 'bootstrap/dist/css/bootstrap.min.css';
 import '../static/everypage.css';
 
 function Main() {
-    return (
+    return (<div className="main running-text">
-        <div className="main running-text">
         <ImprintText/>
-        </div>
+    </div>);
-    );
 }
 
 function ImprintText() {
-    return (
+    return (<Container>
-        <Container>
         <h3>
                 Angaben gemäß §5 TMG:
         </h3>
@@ -40,43 +37,60 @@ function ImprintText() {
         <h3>Haftungsausschluss</h3>
         <h4>Haftung für Inhalte</h4>
         <p>
-                Die Inhalte unserer Seiten wurden mit größter Sorgfalt erstellt. Für die Richtigkeit, Vollständigkeit und Aktualität
+                Die Inhalte unserer Seiten wurden mit größter Sorgfalt erstellt. Für die Richtigkeit, Vollständigkeit
-                der Inhalte können wir jedoch keine Gewähr übernehmen. Als Diensteanbieter sind wir gemäß § 7 Abs.1 TMG für eigene
+                und Aktualität
-                Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach §§ 8 bis 10 TMG sind wir als
+                der Inhalte können wir jedoch keine Gewähr übernehmen. Als Diensteanbieter sind wir gemäß § 7 Abs.1 TMG
-                Diensteanbieter jedoch nicht verpflichtet, übermittelte oder gespeicherte fremde Informationen zu überwachen oder nach
+                für eigene
-                Umständen zu forschen, die auf eine rechtswidrige Tätigkeit hinweisen. Verpflichtungen zur Entfernung oder Sperrung
+                Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach §§ 8 bis 10 TMG sind wir
-                der Nutzung von Informationen nach den allgemeinen Gesetzen bleiben hiervon unberührt. Eine diesbezügliche Haftung ist
+                als
-                jedoch erst ab dem Zeitpunkt der Kenntnis einer konkreten Rechtsverletzung möglich. Bei Bekanntwerden von
+                Diensteanbieter jedoch nicht verpflichtet, übermittelte oder gespeicherte fremde Informationen zu
+                überwachen oder nach
+                Umständen zu forschen, die auf eine rechtswidrige Tätigkeit hinweisen. Verpflichtungen zur Entfernung
+                oder Sperrung
+                der Nutzung von Informationen nach den allgemeinen Gesetzen bleiben hiervon unberührt. Eine
+                diesbezügliche Haftung ist
+                jedoch erst ab dem Zeitpunkt der Kenntnis einer konkreten Rechtsverletzung möglich. Bei Bekanntwerden
+                von
                 entsprechenden Rechtsverletzungen werden wir diese Inhalte umgehend entfernen.
         </p>
         <h4>Haftung für Links</h4>
         <p>
-                Unser Angebot enthält Links zu externen Webseiten Dritter, auf deren Inhalte wir keinen Einfluss haben. Deshalb können
+                Unser Angebot enthält Links zu externen Webseiten Dritter, auf deren Inhalte wir keinen Einfluss haben.
-                wir für diese fremden Inhalte auch keine Gewähr übernehmen. Für die Inhalte der verlinkten Seiten ist stets der
+                Deshalb können
-                jeweilige Anbieter oder Betreiber der Seiten verantwortlich. Die verlinkten Seiten wurden zum Zeitpunkt der Verlinkung
+                wir für diese fremden Inhalte auch keine Gewähr übernehmen. Für die Inhalte der verlinkten Seiten ist
-                auf mögliche Rechtsverstöße überprüft. Rechtswidrige Inhalte waren zum Zeitpunkt der Verlinkung nicht erkennbar. Eine
+                stets der
-                permanente inhaltliche Kontrolle der verlinkten Seiten ist jedoch ohne konkrete Anhaltspunkte einer Rechtsverletzung
+                jeweilige Anbieter oder Betreiber der Seiten verantwortlich. Die verlinkten Seiten wurden zum Zeitpunkt
+                der Verlinkung
+                auf mögliche Rechtsverstöße überprüft. Rechtswidrige Inhalte waren zum Zeitpunkt der Verlinkung nicht
+                erkennbar. Eine
+                permanente inhaltliche Kontrolle der verlinkten Seiten ist jedoch ohne konkrete Anhaltspunkte einer
+                Rechtsverletzung
                 nicht zumutbar. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Links umgehend entfernen.
         </p>
         <h4>Urheberrecht</h4>
         <p>
-                Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht.
+                Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen
-                Die Vervielfältigung, Bearbeitung, Verbreitung und jede Art der Verwertung außerhalb der Grenzen des Urheberrechtes
+                Urheberrecht.
-                bedürfen der schriftlichen Zustimmung des jeweiligen Autors bzw. Erstellers. Downloads und Kopien dieser Seite sind
+                Die Vervielfältigung, Bearbeitung, Verbreitung und jede Art der Verwertung außerhalb der Grenzen des
-                nur für den privaten, nicht kommerziellen Gebrauch gestattet. Soweit die Inhalte auf dieser Seite nicht vom Betreiber
+                Urheberrechtes
-                erstellt wurden, werden die Urheberrechte Dritter beachtet. Insbesondere werden Inhalte Dritter als solche
+                bedürfen der schriftlichen Zustimmung des jeweiligen Autors bzw. Erstellers. Downloads und Kopien dieser
-                gekennzeichnet. Sollten Sie trotzdem auf eine Urheberrechtsverletzung aufmerksam werden, bitten wir um einen
+                Seite sind
-                entsprechenden Hinweis. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Inhalte umgehend entfernen.
+                nur für den privaten, nicht kommerziellen Gebrauch gestattet. Soweit die Inhalte auf dieser Seite nicht
+                vom Betreiber
+                erstellt wurden, werden die Urheberrechte Dritter beachtet. Insbesondere werden Inhalte Dritter als
+                solche
+                gekennzeichnet. Sollten Sie trotzdem auf eine Urheberrechtsverletzung aufmerksam werden, bitten wir um
+                einen
+                entsprechenden Hinweis. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Inhalte umgehend
+                entfernen.
         </p>
-        </Container>
+    </Container>);
-    );
 }
 
 
 export default class ImprintPage extends React.Component {
     render() {
-        return (
+        return (<div>
-            <div>
             <Head>
                 <title>Impressum: turnie.re</title>
             </Head>
@@ -84,7 +98,6 @@ export default class ImprintPage extends React.Component {
             <BigImage text="Impressum / Haftungs&shy;ausschluss"/>
             <Main/>
             <Footer/>
-            </div>
+        </div>);
-        );
     }
 }

pages/index.js

@@ -2,10 +2,7 @@ import Head from 'next/head';
 import React from 'react';
 import {connect} from 'react-redux';
 import {
-    Alert,
+    Alert, Button, Card, CardBody
-    Button,
-    Card,
-    CardBody
 } from 'reactstrap';
 
 import {TurniereNavigation} from '../js/components/Navigation';
@@ -18,60 +15,49 @@ import '../static/everypage.css';
 import '../static/css/index.css';
 
 function Main() {
-    return (
+    return (<div className="main">
-        <div className="main">
         <Marketing/>
         <MainPromotedLinks/>
         <MainBottomSummary/>
-        </div>
+    </div>);
-    );
 }
 
 function Marketing() {
-    return (
+    return (<div className="container marketing my-5">
-        <div className="container marketing my-5">
         <div className="row">
             <div className="col-lg-4">
                 <h2>Für jede Sportart</h2>
                 <p>
                     Egal, um welche Sportart es geht: Solange du mit mehreren Mannschaften ein Turnier veranstalten
-                        willst, kann
+                    willst, kann turnie.re dir ein Turnier berechnen!
-                        turnie.re dir ein Turnier berechnen!
                 </p>
             </div>
             <div className="col-lg-4">
                 <h2>Beliebige Anzahl Teams</h2>
                 <p>
                     Egal, wie viele Teams du gerne in deinem Turnier hast, wir regeln das. Füge einfach deine Teams
-                        hinzu
+                    hinzu und schon sagen wir dir, wer gegen wen spielt. </p>
-                        und schon sagen wir dir, wer gegen wen spielt.
-                    </p>
             </div>
             <div className="col-lg-4">
                 <h2>Kostenlos</h2>
                 <p>
                     turnie.re ist ein kostenloser Service! Wir erheben keine Kosten und sind nur darauf aus, dein
-                        Turnier-Management so einfach wie möglich zu gestalten.
+                    Turnier-Management so einfach wie möglich zu gestalten. </p>
-                    </p>
             </div>
 
         </div>
         <Betawarning/>
-        </div>
+    </div>);
-    );
 }
 
 function Betawarning() {
-    return (
+    return (<Alert color="danger" className="shadow-sm mt-4" fade={false}>
-        <Alert color="danger" className="shadow-sm mt-4" fade={false}>
         <h4 className="alert-heading custom-font">Public Beta</h4>
         <p>
             Diese Website ist noch in der Entwicklung.<br/>
             Bei Problemen fülle bitte <a href="#" id="bugLink" className="alert-link">dieses </a>
-                und für Feedback <a href="#" id="feedbackLink" className="alert-link">dieses</a> Formular aus.
+            und für Feedback <a href="#" id="feedbackLink" className="alert-link">dieses</a> Formular aus. </p>
-            </p>
+    </Alert>);
-        </Alert>
-    );
 }
 
 function MainBottomSummary() {
@@ -84,17 +70,15 @@ function MainBottomSummary() {
                     turnie.re berechnet dir ein Turnier. Allein aus den Team-Namen berechnen wir dir einen kompletten
                     Spielplan,
                     den du auch gleich mit allen Leuten teilen kannst, ohne dir Gedanken machen zu müssen, wer gegen wen
-                    spielen
+                    spielen muss.<br/>
-                    muss.<br/>
+                    Du trägst ein, wer gewonnen hat, und turnie.re sagt, wer als nächstes spielt. </p>
-                    Du trägst ein, wer gewonnen hat, und turnie.re sagt, wer als nächstes spielt.
-                </p>
             </div>
             <div className="col-lg-6">
                 <h2>Ich habe einen Turniercode bekommen. Was nun?</h2>
                 <p>
-                    Der Turniercode führt dich direkt zu einem Turnier. Gebe dafür den Code
+                    Der Turniercode führt dich direkt zu einem Turnier. Gebe dafür den Code <a className="text-success"
-                    <a className="text-success" href="#turniercode-form">oben</a> ein, dann wirst du sofort weitergeleitet.
+                        href="#turniercode-form">oben</a> ein,
-                </p>
+                    dann wirst du sofort weitergeleitet. </p>
             </div>
         </div>
         <div className="my-5 text-center">
@@ -114,8 +98,7 @@ function MainPromotedLinks() {
 }
 
 function PromotedLinkTournamentCode() {
-    return (
+    return (<Card className="container shadow-lg mt-3">
-        <Card className="container shadow-lg mt-3">
         <CardBody className="row">
             <form id="turniercode-form" className="col-lg-4" action="/t" method="get">
                 <input className="form-control" type="search" name="code" placeholder="Turnier-Code"/>
@@ -125,30 +108,24 @@ function PromotedLinkTournamentCode() {
                 <p>Gib hier einen Turnier Code ein, um direkt zum entsprechenden Turnier zu gelangen.</p>
             </div>
         </CardBody>
-        </Card>
+    </Card>);
-    );
 }
 
 function PromotedLinkListTournaments() {
-    return (
+    return (<Card className="container shadow-lg my-4">
-        <Card className="container shadow-lg my-4">
         <CardBody className="row">
             <div className="col-lg-4 pb-3">
                 <Button outline color="success" className="w-100" href="/list">Alle Turniere anzeigen</Button>
             </div>
             <div className="col-lg-8">
                 <p>
-                        Hier findest du alle öffentlichen Turniere. Wenn du ein Turnier suchst, den Turniercode aber
+                    Hier findest du alle öffentlichen Turniere. Wenn du ein Turnier suchst, den Turniercode aber nicht
-                        nicht hast, wirst
+                    hast, wirst du wahrscheinlich hier fündig. </p>
-                        du wahrscheinlich hier fündig.
-                    </p>
                 <p>
-                        Wenn du eingeloggt bist, findest du hier auch deine eigenen Turniere.
+                    Wenn du eingeloggt bist, findest du hier auch deine eigenen Turniere. </p>
-                    </p>
             </div>
         </CardBody>
-        </Card>
+    </Card>);
-    );
 }
 
 function PromotedLinkCreateTournament() {
@@ -156,9 +133,8 @@ function PromotedLinkCreateTournament() {
         <CardBody className="row">
             <div className="col-lg-8">
                 <p>
-                    <strong>Einfach ausprobieren:</strong> Einen Turnier-Namen, ein paar Team-Namen, und schon
+                    <strong>Einfach ausprobieren:</strong> Einen Turnier-Namen, ein paar Team-Namen, und schon kriegst
-                    kriegst du ein
+                    du ein komplettes Turnier!
-                    komplettes Turnier!
                 </p>
             </div>
             <div className="col-lg-4">
@@ -171,8 +147,7 @@ function PromotedLinkCreateTournament() {
 
 class Index extends React.Component {
     render() {
-        return (
+        return (<div>
-            <div>
             <Head>
                 <title>turnie.re</title>
             </Head>
@@ -180,8 +155,7 @@ class Index extends React.Component {
             <BigImage text="Einfach Turniere organisieren"/>
             <Main/>
             <Footer/>
-            </div>
+        </div>);
-        );
     }
 }
 

pages/list.js

@@ -11,8 +11,7 @@ import {connect} from 'react-redux';
 
 export default class PublicTournamentsPage extends React.Component {
     render() {
-        return (
+        return (<div className="main generic-fullpage-bg">
-            <div className="main generic-fullpage-bg">
             <Head>
                 <title>Öffentliche Turniere: turnie.re</title>
             </Head>
@@ -21,8 +20,7 @@ export default class PublicTournamentsPage extends React.Component {
                 <PublicTournamentPageContent/>
             </div>
             <Footer/>
-            </div>
+        </div>);
-        );
     }
 }
 
@@ -31,9 +29,7 @@ function mapStateToProperties(state) {
     return {isSignedIn};
 }
 
-const PublicTournamentPageContent = connect(
+const PublicTournamentPageContent = connect(mapStateToProperties)(PublicTournaments);
-    mapStateToProperties,
-)(PublicTournaments);
 
 function PublicTournaments(props) {
     if (props.isSignedIn) {

pages/login.js

@@ -9,8 +9,7 @@ import '../static/everypage.css';
 
 export default class LoginPage extends React.Component {
     render() {
-        return (
+        return (<div className="main generic-fullpage-bg">
-            <div className="main generic-fullpage-bg">
             <Head>
                 <title>Login: turnie.re</title>
             </Head>
@@ -19,7 +18,6 @@ export default class LoginPage extends React.Component {
                 <Login/>
             </div>
             <Footer/>
-            </div>
+        </div>);
-        );
     }
 }

pages/privacy.js

@@ -11,31 +11,23 @@ import 'bootstrap/dist/css/bootstrap.min.css';
 import '../static/everypage.css';
 
 function Main() {
-    return (
+    return (<div className="main running-text">
-        <div className="main running-text">
         <PrivacyText/>
-        </div>
+    </div>);
-    );
 }
 
 function PrivacyText() {
-    return (
+    return (<Container>
-        <Container>
         <p>
             Die nachfolgende Datenschutzerklärung gilt für die Nutzung unseres Online-Angebots turnie.re (nachfolgend
             „Website“).<br/>
             Wir messen dem Datenschutz große Bedeutung bei. Die Erhebung und Verarbeitung Ihrer personenbezogenen Daten
-                geschieht
+            geschieht unter Beachtung der geltenden datenschutzrechtlichen Vorschriften, insbesondere der
-                unter Beachtung der geltenden datenschutzrechtlichen Vorschriften, insbesondere der
+            Datenschutzgrundverordnung (DSGVO). </p>
-                Datenschutzgrundverordnung
-                (DSGVO).
-            </p>
         <h3>1 Verantwortlicher</h3>
         <p>
             Verantwortlicher für die Erhebung, Verarbeitung und Nutzung Ihrer personenbezogenen Daten im Sinne von Art.
-                4 Nr. 7
+            4 Nr. 7 DSGVO ist </p>
-                DSGVO ist
-            </p>
         <p>
             Jonas Seydel<br/>
             August-Euler-Weg 3<br/>
@@ -45,16 +37,12 @@ function PrivacyText() {
         </p>
         <p>
             Sofern Sie der Erhebung, Verarbeitung oder Nutzung Ihrer Daten durch uns nach Maßgabe dieser
-                Datenschutzbestimmungen
+            Datenschutzbestimmungen insgesamt oder für einzelne Maßnahmen widersprechen wollen, können Sie Ihren
-                insgesamt oder für einzelne Maßnahmen widersprechen wollen, können Sie Ihren Widerspruch an den
+            Widerspruch an den Verantwortlichen richten.<br/>
-                Verantwortlichen
+            Sie können diese Datenschutzerklärung jederzeit speichern und ausdrucken. </p>
-                richten.<br/>
-                Sie können diese Datenschutzerklärung jederzeit speichern und ausdrucken.
-            </p>
         <h3>2 Allgemeine Zwecke der Verarbeitung</h3>
         <p>
-                Wir verwenden personenbezogene Daten zum Zweck des Betriebs der Website.
+            Wir verwenden personenbezogene Daten zum Zweck des Betriebs der Website. </p>
-            </p>
         <h3>3 Welche Daten wir verwenden und warum</h3>
         <h4>3.1 Hosting</h4>
         <p>
@@ -66,20 +54,15 @@ function PrivacyText() {
             Hierbei verarbeiten wir, bzw. unser Hostinganbieter Bestandsdaten, Kontaktdaten, Inhaltsdaten,
             Vertragsdaten,
             Nutzungsdaten, Meta- und Kommunikationsdaten von Kunden, Interessenten und Besuchern dieser Website auf
-                Grundlage
+            Grundlage unserer berechtigten Interessen an einer effizienten und sicheren Zurverfügungstellung unserer
-                unserer berechtigten Interessen an einer effizienten und sicheren Zurverfügungstellung unserer Website gem.
+            Website gem. Art. 6 Abs. 1 S. 1 f) DSGVO i.V.m. Art. 28 DSGVO. </p>
-                Art. 6
-                Abs. 1 S. 1 f) DSGVO i.V.m. Art. 28 DSGVO.
-            </p>
         <h4>3.2 Zugriffsdaten</h4>
         <p>
             Wir sammeln Informationen über Sie, wenn Sie diese Website nutzen. Wir erfassen automatisch Informationen
-                über Ihr
+            über Ihr Nutzungsverhalten und Ihre Interaktion mit uns und registrieren Daten zu Ihrem Computer oder
-                Nutzungsverhalten und Ihre Interaktion mit uns und registrieren Daten zu Ihrem Computer oder Mobilgerät. Wir
+            Mobilgerät. Wir erheben,
-                erheben,
             speichern und nutzen Daten über jeden Zugriff auf unsere Website (sogenannte Serverlogfiles). Zu den
-                Zugriffsdaten
+            Zugriffsdaten gehören:
-                gehören:
         </p>
         <ul>
             <li>Name und URL der abgerufenen Datei</li>
@@ -95,60 +78,40 @@ function PrivacyText() {
         </ul>
         <p>
             Wir nutzen diese Protokolldaten ohne Zuordnung zu Ihrer Person oder sonstiger Profilerstellung für
-                statistische
+            statistische Auswertungen zum Zweck des Betriebs, der Sicherheit und der Optimierung unserer Website, aber
-                Auswertungen zum Zweck des Betriebs, der Sicherheit und der Optimierung unserer Website, aber auch zur
+            auch zur anonymen Erfassung der Anzahl der Besucher auf unserer Website (traffic) sowie zum Umfang und zur
-                anonymen
+            Art der Nutzung unserer Website und Dienste, ebenso zu Abrechnungszwecken, um die Anzahl der von
-                Erfassung der Anzahl der Besucher auf unserer Website (traffic) sowie zum Umfang und zur Art der Nutzung
+            Kooperationspartnern erhaltenen Clicks zu messen. Aufgrund dieser Informationen können wir personalisierte
-                unserer
+            und standortbezogene Inhalte zur Verfügung stellen und den Datenverkehr analysieren, Fehler suchen und
-                Website und Dienste, ebenso zu Abrechnungszwecken, um die Anzahl der von Kooperationspartnern erhaltenen
+            beheben und unsere Dienste verbessern.<br/>
-                Clicks zu
-                messen. Aufgrund dieser Informationen können wir personalisierte und standortbezogene Inhalte zur Verfügung
-                stellen
-                und den Datenverkehr analysieren, Fehler suchen und beheben und unsere Dienste verbessern.<br/>
             Hierin liegt auch unser berechtigtes Interesse gemäß Art 6 Abs. 1 S. 1 f) DSGVO.<br/>
             Wir behalten uns vor, die Protokolldaten nachträglich zu überprüfen, wenn aufgrund konkreter Anhaltspunkte
-                der
+            der berechtigte Verdacht einer rechtswidrigen Nutzung besteht. IP-Adressen speichern wir für einen
-                berechtigte Verdacht einer rechtswidrigen Nutzung besteht. IP-Adressen speichern wir für einen begrenzten
+            begrenzten Zeitraum in den Logfiles, wenn dies für Sicherheitszwecke erforderlich oder für die
-                Zeitraum in
+            Leistungserbringung oder die Abrechnung einer Leistung nötig ist, z. B. wenn Sie eines unserer Angebote
-                den Logfiles, wenn dies für Sicherheitszwecke erforderlich oder für die Leistungserbringung oder die
+            nutzen. Nach Abbruch des Vorgangs der Bestellung oder nach Zahlungseingang löschen wir die IP-Adresse, wenn
-                Abrechnung einer
+            diese für Sicherheitszwecke nicht mehr erforderlich ist. IP-Adressen speichern wir auch dann, wenn wir den
-                Leistung nötig ist, z. B. wenn Sie eines unserer Angebote nutzen. Nach Abbruch des Vorgangs der Bestellung
+            konkreten Verdacht einer Straftat im Zusammenhang mit der Nutzung unserer Website haben. Außerdem speichern
-                oder nach
+            wir als Teil Ihres Accounts das Datum Ihres letzten Besuchs (z.B. bei Registrierung,
-                Zahlungseingang löschen wir die IP-Adresse, wenn diese für Sicherheitszwecke nicht mehr erforderlich ist.
+            Login, Klicken von Links etc.). </p>
-                IP-Adressen
-                speichern wir auch dann, wenn wir den konkreten Verdacht einer Straftat im Zusammenhang mit der Nutzung
-                unserer
-                Website haben. Außerdem speichern wir als Teil Ihres Accounts das Datum Ihres letzten Besuchs (z.B. bei
-                Registrierung,
-                Login, Klicken von Links etc.).
-            </p>
         <h4>3.3 Cookies</h4>
         <p>
             Wir verwenden sogenannte Session-Cookies, um unsere Website zu optimieren. Ein Session-Cookie ist eine
-                kleine
+            kleine Textdatei, die von den jeweiligen Servern beim Besuch einer Internetseite verschickt und auf Ihrer
-                Textdatei, die von den jeweiligen Servern beim Besuch einer Internetseite verschickt und auf Ihrer
+            Festplatte zwischengespeichert wird. Diese Datei als solche enthält eine sogenannte Session-ID, mit welcher
-                Festplatte
+            sich verschiedene Anfragen Ihres Browsers der gemeinsamen Sitzung zuordnen lassen. Dadurch kann Ihr Rechner
-                zwischengespeichert wird. Diese Datei als solche enthält eine sogenannte Session-ID, mit welcher sich
+            wiedererkannt werden, wenn Sie auf unsere Website zurückkehren. Diese Cookies werden gelöscht, nachdem Sie
-                verschiedene
+            Ihren Browser schließen. Sie dienen z. B. dazu, dass Sie die Warenkorbfunktion über mehrere Seiten hinweg
-                Anfragen Ihres Browsers der gemeinsamen Sitzung zuordnen lassen. Dadurch kann Ihr Rechner wiedererkannt
+            nutzen können.<br/>
-                werden, wenn
-                Sie auf unsere Website zurückkehren. Diese Cookies werden gelöscht, nachdem Sie Ihren Browser schließen. Sie
-                dienen z.
-                B. dazu, dass Sie die Warenkorbfunktion über mehrere Seiten hinweg nutzen können.<br/>
             Wir verwenden in geringem Umfang auch persistente Cookies (ebenfalls kleine Textdateien, die auf Ihrem
-                Endgerät
+            Endgerät abgelegt werden), die auf Ihrem Endgerät verbleiben und es uns ermöglichen, Ihren Browser beim
-                abgelegt werden), die auf Ihrem Endgerät verbleiben und es uns ermöglichen, Ihren Browser beim nächsten
+            nächsten Besuch wiederzuerkennen. Diese Cookies werden auf Ihrer Festplatte gespeichert und löschen sich
-                Besuch
+            nach der vorgegebenen Zeit von allein. Ihre Lebensdauer beträgt 1 Monat bis 10 Jahre. So können wir Ihnen
-                wiederzuerkennen. Diese Cookies werden auf Ihrer Festplatte gespeichert und löschen sich nach der
+            unser Angebot nutzerfreundlicher,
-                vorgegebenen Zeit
-                von allein. Ihre Lebensdauer beträgt 1 Monat bis 10 Jahre. So können wir Ihnen unser Angebot
-                nutzerfreundlicher,
             effektiver und sicherer präsentieren und Ihnen beispielsweise speziell auf Ihre Interessen abgestimmte
-                Informationen
+            Informationen auf der Seite anzeigen.<br/>
-                auf der Seite anzeigen.<br/>
+            Unser berechtigtes Interesse an der Nutzung der Cookies gemäß Art 6 Abs. 1 S. 1 f) DSGVO liegt darin,
-                Unser berechtigtes Interesse an der Nutzung der Cookies gemäß Art 6 Abs. 1 S. 1 f) DSGVO liegt darin, unsere
+            unsere Website nutzerfreundlicher, effektiver und sicherer zu machen.<br/>
-                Website
-                nutzerfreundlicher, effektiver und sicherer zu machen.<br/>
             In den Cookies werden etwa folgende Daten und Informationen gespeichert:
         </p>
         <ul>
@@ -162,74 +125,53 @@ function PrivacyText() {
         <p>
             Bei Aktivierung des Cookies wird diesem eine Identifikationsnummer zugewiesen und eine Zuordnung Ihrer
             personenbezogenen Daten zu dieser Identifikationsnummer wird nicht vorgenommen. Ihr Name, Ihre IP-Adresse
-                oder
+            oder ähnliche Daten, die eine Zuordnung des Cookies zu Ihnen ermöglichen würden, werden nicht in den Cookie
-                ähnliche Daten, die eine Zuordnung des Cookies zu Ihnen ermöglichen würden, werden nicht in den Cookie
+            eingelegt. Auf Basis der Cookie-Technologie erhalten wir lediglich pseudonymisierte Informationen,
-                eingelegt. Auf
+            beispielsweise darüber,
-                Basis der Cookie-Technologie erhalten wir lediglich pseudonymisierte Informationen, beispielsweise darüber,
+            welche Seiten unseres Shops besucht wurden, welche Produkte angesehen wurden, etc.<br/>
-                welche
-                Seiten unseres Shops besucht wurden, welche Produkte angesehen wurden, etc.<br/>
             Sie können Ihren Browser so einstellen, dass Sie über das Setzen von Cookies vorab informiert werden und im
-                Einzelfall
+            Einzelfall entscheiden können, ob Sie die Annahme von Cookies für bestimmte Fälle oder generell
-                entscheiden können, ob Sie die Annahme von Cookies für bestimmte Fälle oder generell ausschließen, oder dass
+            ausschließen, oder dass Cookies komplett verhindert werden. Dadurch kann die Funktionalität der Website
-                Cookies
+            eingeschränkt werden. </p>
-                komplett verhindert werden. Dadurch kann die Funktionalität der Website eingeschränkt werden.
-            </p>
         <h4>3.4 Nutzerkonto</h4>
         <p>Sie können auf unserer Website ein Nutzerkonto anlegen. Wünschen Sie dies, so benötigen wir die beim Login
-                abgefragten
+            abgefragten personenbezogenen Daten. Beim späteren Einloggen werden nur Ihre Email bzw. Benutzername und das
-                personenbezogenen Daten. Beim späteren Einloggen werden nur Ihre Email bzw. Benutzername und das von Ihnen
+            von Ihnen gewählte Passwort benötigt.<br/>
-                gewählte
-                Passwort benötigt.<br/>
             Für die Neuregistrierung erheben wir Stammdaten (z. B. Name, Adresse), Kommunikationsdaten (z. B.
             E-Mail-Adresse)
             sowie Zugangsdaten (Benutzername u. Passwort).<br/>
-                    Sie können ein einmal angelegtes Nutzerkonto jederzeit von uns löschen lassen, ohne dass hierfür andere
+            Sie können ein einmal angelegtes Nutzerkonto jederzeit von uns löschen lassen, ohne dass hierfür andere als
-                    als die
+            die Übermittlungskosten nach den Basistarifen entstehen. Eine Mitteilung in Textform an die unter Ziffer 1
-                    Übermittlungskosten nach den Basistarifen entstehen. Eine Mitteilung in Textform an die unter Ziffer 1
+            genannten Kontaktdaten (z.B. E-Mail, Fax, Brief) reicht hierfür aus. Wir werden dann Ihre gespeicherten
-                    genannten
+            personenbezogenen Daten löschen, soweit wir diese nicht noch zur Abwicklung von Bestellungen oder aufgrund
-                    Kontaktdaten (z.B. E-Mail, Fax, Brief) reicht hierfür aus. Wir werden dann Ihre gespeicherten
+            gesetzlicher Aufbewahrungspflichten speichern müssen.<br/>
-                    personenbezogenen Daten
-                    löschen, soweit wir diese nicht noch zur Abwicklung von Bestellungen oder aufgrund gesetzlicher
-                    Aufbewahrungspflichten
-                    speichern müssen.<br/>
             Rechtgrundlage für die Verarbeitung dieser Daten ist Ihre Einwilligung gemäß Art. 6 Abs. 1 S. 1 a)
-                    DSGVO.
+            DSGVO. </p>
-            </p>
         <h4>3.5 E-Mail Kontakt</h4>
         <p>
             Wenn Sie mit uns in Kontakt treten (z. B. per Kontaktformular oder E-Mail), verarbeiten wir Ihre Angaben zur
-                Bearbeitung der Anfrage sowie für den Fall, dass Anschlussfragen entstehen.
+            Bearbeitung der Anfrage sowie für den Fall, dass Anschlussfragen entstehen. Erfolgt die Datenverarbeitung
-                Erfolgt die Datenverarbeitung zur Durchführung vorvertraglicher Maßnahmen, die auf Ihre Anfrage hin
+            zur Durchführung vorvertraglicher Maßnahmen, die auf Ihre Anfrage hin erfolgen, bzw.,
-                erfolgen, bzw.,
             wenn Sie bereits unser Kunde sind, zur Durchführung des Vertrages, ist Rechtsgrundlage für diese
-                Datenverarbeitung
+            Datenverarbeitung Art. 6 Abs. 1 S. 1 b) DSGVO. Weitere personenbezogene Daten verarbeiten wir nur, wenn Sie
-                Art. 6 Abs. 1 S. 1 b) DSGVO.
+            dazu einwilligen (Art. 6 Abs. 1 S. 1 a)
-                Weitere personenbezogene Daten verarbeiten wir nur, wenn Sie dazu einwilligen (Art. 6 Abs. 1 S. 1 a) DSGVO)
+            DSGVO)
-                oder wir
+            oder wir ein berechtigtes Interesse an der Verarbeitung Ihrer Daten haben (Art. 6 Abs. 1 S. 1 f) DSGVO). Ein
-                ein berechtigtes Interesse an der Verarbeitung Ihrer Daten haben (Art. 6 Abs. 1 S. 1 f) DSGVO). Ein
+            berechtigtes Interesse liegt z. B. darin, auf Ihre E-Mail zu antworten. </p>
-                berechtigtes
-                Interesse liegt z. B. darin, auf Ihre E-Mail zu antworten.
-            </p>
         <h3>4 Speicherdauer</h3>
         <p>
             Sofern nicht spezifisch angegeben speichern wir personenbezogene Daten nur so lange, wie dies zur Erfüllung
-                der
+            der verfolgten Zwecke notwendig ist.<br/>
-                verfolgten Zwecke notwendig ist.<br/>
             In einigen Fällen sieht der Gesetzgeber die Aufbewahrung von personenbezogenen Daten vor, etwa im Steuer-
-                oder
+            oder Handelsrecht. In diesen Fällen werden die Daten von uns lediglich für diese gesetzlichen Zwecke weiter
-                Handelsrecht. In diesen Fällen werden die Daten von uns lediglich für diese gesetzlichen Zwecke weiter
             gespeichert,
-                aber nicht anderweitig verarbeitet und nach Ablauf der gesetzlichen Aufbewahrungsfrist gelöscht.
+            aber nicht anderweitig verarbeitet und nach Ablauf der gesetzlichen Aufbewahrungsfrist gelöscht. </p>
-            </p>
         <h3>5 Ihre Rechte als von der Datenverarbeitung Betroffener</h3>
         <p>
             Nach den anwendbaren Gesetzen haben Sie verschiedene Rechte bezüglich Ihrer personenbezogenen Daten. Möchten
-                Sie diese
+            Sie diese Rechte geltend machen, so richten Sie Ihre Anfrage bitte per E-Mail oder per Post unter
-                Rechte geltend machen, so richten Sie Ihre Anfrage bitte per E-Mail oder per Post unter eindeutiger
+            eindeutiger Identifizierung Ihrer Person an die in Ziffer 1 genannte Adresse.<br/>
-                Identifizierung
+            Nachfolgend finden Sie eine Übersicht über Ihre Rechte. </p>
-                Ihrer Person an die in Ziffer 1 genannte Adresse.<br/>
-                Nachfolgend finden Sie eine Übersicht über Ihre Rechte.
-            </p>
 
         <h4>5.1 Recht auf Bestätigung und Auskunft</h4>
         <p>
@@ -238,58 +180,46 @@ function PrivacyText() {
             Im Einzelnen:<br/>
 
             Sie haben jederzeit das Recht, von uns eine Bestätigung darüber zu erhalten, ob Sie betreffende
-                personenbezogene Daten
+            personenbezogene Daten verarbeitet werden. Ist dies der Fall, so haben Sie das Recht, von uns eine
-                verarbeitet werden. Ist dies der Fall, so haben Sie das Recht, von uns eine unentgeltliche Auskunft über die
+            unentgeltliche Auskunft über die zu Ihnen gespeicherten personenbezogenen Daten nebst einer Kopie dieser
-                zu Ihnen
+            Daten zu verlangen. Des Weiteren besteht ein Recht auf folgende Informationen:
-                gespeicherten personenbezogenen Daten nebst einer Kopie dieser Daten zu verlangen. Des Weiteren besteht ein
-                Recht auf
-                folgende Informationen:
         </p>
         <ol>
             <li>die Verarbeitungszwecke;</li>
             <li>die Kategorien personenbezogener Daten, die verarbeitet werden;</li>
             <li>die Empfänger oder Kategorien von Empfängern, gegenüber denen die personenbezogenen Daten offengelegt
-                    worden sind
+                worden sind oder noch offengelegt werden, insbesondere bei Empfängern in Drittländern oder bei
-                    oder noch offengelegt werden, insbesondere bei Empfängern in Drittländern oder bei internationalen
+                internationalen Organisationen;
-                    Organisationen;
             </li>
-                <li>falls möglich, die geplante Dauer, für die die personenbezogenen Daten gespeichert werden, oder, falls
+            <li>falls möglich, die geplante Dauer, für die die personenbezogenen Daten gespeichert werden, oder,
-                    dies nicht
+                falls dies nicht möglich ist, die Kriterien für die Festlegung dieser Dauer;
-                    möglich ist, die Kriterien für die Festlegung dieser Dauer;
             </li>
             <li>das Bestehen eines Rechts auf Berichtigung oder Löschung der Sie betreffenden personenbezogenen Daten
-                    oder auf
+                oder auf Einschränkung der Verarbeitung durch den Verantwortlichen oder eines Widerspruchsrechts gegen
-                    Einschränkung der Verarbeitung durch den Verantwortlichen oder eines Widerspruchsrechts gegen diese
+                diese Verarbeitung;
-                    Verarbeitung;
             </li>
             <li>das Bestehen eines Beschwerderechts bei einer Aufsichtsbehörde;</li>
             <li>wenn die personenbezogenen Daten nicht bei Ihnen erhoben werden, alle verfügbaren Informationen über die
-                    Herkunft
+                Herkunft der Daten;
-                    der Daten;
             </li>
             <li>das Bestehen einer automatisierten Entscheidungsfindung einschließlich Profiling gemäß Art. 22 Abs. 1
-                    und 4 DSGVO
+                und 4 DSGVO und – zumindest in diesen Fällen – aussagekräftige Informationen über die involvierte Logik
-                    und – zumindest in diesen Fällen – aussagekräftige Informationen über die involvierte Logik sowie die
+                sowie die Tragweite und die angestrebten Auswirkungen einer derartigen Verarbeitung für Sie.
-                    Tragweite
-                    und die angestrebten Auswirkungen einer derartigen Verarbeitung für Sie.
             </li>
         </ol>
         <p>
             Werden personenbezogene Daten an ein Drittland oder an eine internationale Organisation übermittelt, so
-                haben Sie das
+            haben Sie das Recht, über die geeigneten Garantien gemäß Art. 46 DSGVO im Zusammenhang mit der Übermittlung
-                Recht, über die geeigneten Garantien gemäß Art. 46 DSGVO im Zusammenhang mit der Übermittlung unterrichtet
+            unterrichtet zu werden. </p>
-                zu werden.
-            </p>
         <h4>5.2 Recht auf Berichtigung</h4>
         <p>
             Sie haben das Recht, von uns die Berichtigung und ggf. auch Vervollständigung Sie betreffender
-                personenbezogener Daten
+            personenbezogener Daten zu verlangen.<br/>
-                zu verlangen.<br/>
             Im Einzelnen:<br/>
             Sie haben das Recht, von uns unverzüglich die Berichtigung Sie betreffender unrichtiger personenbezogener
-                Daten zu
+            Daten zu verlangen. Unter Berücksichtigung der Zwecke der Verarbeitung haben Sie das Recht, die
-                verlangen. Unter Berücksichtigung der Zwecke der Verarbeitung haben Sie das Recht, die Vervollständigung
+            Vervollständigung unvollständiger personenbezogener Daten – auch mittels einer ergänzenden Erklärung – zu
-                unvollständiger personenbezogener Daten – auch mittels einer ergänzenden Erklärung – zu verlangen.<br/>
+            verlangen.<br/>
         </p>
 
         <h4>5.3 Recht auf Löschung ("Recht auf Vergessenwerden")</h4>
@@ -297,10 +227,9 @@ function PrivacyText() {
             In einer Reihe von Fällen sind wir verpflichtet, Sie betreffende personenbezogene Daten zu löschen.<br/>
             Im Einzelnen:<br/>
             Sie haben gemäß Art. 17 Abs. 1 DSGVO das Recht, von uns zu verlangen, dass Sie betreffende personenbezogene
-                Daten
+            Daten unverzüglich gelöscht werden, und wir sind verpflichtet, personenbezogene Daten unverzüglich zu
-                unverzüglich gelöscht werden, und wir sind verpflichtet, personenbezogene Daten unverzüglich zu löschen,
+            löschen,
-                sofern einer
+            sofern einer der folgenden Gründe zutrifft:
-                der folgenden Gründe zutrifft:
         </p>
         <ol>
             <li>Die personenbezogenen Daten sind für die Zwecke, für die sie erhoben oder auf sonstige Weise verarbeitet
@@ -308,58 +237,45 @@ function PrivacyText() {
                 nicht mehr notwendig.
             </li>
             <li>Sie widerrufen Ihre Einwilligung, auf die sich die Verarbeitung gemäß Art. 6 Abs. 1 S. 1 a) DSGVO oder
-                    Art. 9 Abs.
+                Art. 9 Abs. 2 a) DSGVO stützte, und es fehlt an einer anderweitigen Rechtsgrundlage für die
-                    2 a) DSGVO stützte, und es fehlt an einer anderweitigen Rechtsgrundlage für die Verarbeitung.
+                Verarbeitung.
             </li>
             <li>Sie legen gemäß Art. 21 Abs. 1 DSGVO Widerspruch gegen die Verarbeitung ein und es liegen keine
-                    vorrangigen
+                vorrangigen berechtigten Gründe für die Verarbeitung vor, oder Sie legen gemäß Art. 21 Abs. 2 DSGVO
-                    berechtigten Gründe für die Verarbeitung vor, oder Sie legen gemäß Art. 21 Abs. 2 DSGVO Widerspruch
+                Widerspruch gegen die Verarbeitung ein.
-                    gegen die
-                    Verarbeitung ein.
             </li>
             <li>Die personenbezogenen Daten wurden unrechtmäßig verarbeitet.</li>
             <li>Die Löschung der personenbezogenen Daten ist zur Erfüllung einer rechtlichen Verpflichtung nach dem
-                    Unionsrecht
+                Unionsrecht oder dem Recht der Mitgliedstaaten erforderlich, dem wir unterliegen.
-                    oder dem Recht der Mitgliedstaaten erforderlich, dem wir unterliegen.
             </li>
             <li>Die personenbezogenen Daten wurden in Bezug auf angebotene Dienste der Informationsgesellschaft gemäß
-                    Art. 8 Abs.
+                Art. 8 Abs. 1 DSGVO erhoben.
-                    1 DSGVO erhoben.
             </li>
         </ol>
         <p>
             Haben wir die personenbezogenen Daten öffentlich gemacht und sind wir gemäß Art. 17 Abs. 1 DSGVO zu deren
-                Löschung
+            Löschung verpflichtet, so treffen wir unter Berücksichtigung der verfügbaren Technologie und der
-                verpflichtet, so treffen wir unter Berücksichtigung der verfügbaren Technologie und der
+            Implementierungskosten angemessene Maßnahmen, auch technischer Art, um für die Datenverarbeitung
-                Implementierungskosten
+            Verantwortliche, die die personenbezogenen Daten verarbeiten, darüber zu informieren, dass Sie von ihnen die
-                angemessene Maßnahmen, auch technischer Art, um für die Datenverarbeitung Verantwortliche, die die
+            Löschung aller Links zu diesen personenbezogenen Daten oder von Kopien oder Replikationen dieser
-                personenbezogenen
+            personenbezogenen Daten verlangt haben. </p>
-                Daten verarbeiten, darüber zu informieren, dass Sie von ihnen die Löschung aller Links zu diesen
-                personenbezogenen
-                Daten oder von Kopien oder Replikationen dieser personenbezogenen Daten verlangt haben.
-            </p>
         <h4>5.4 Recht auf Einschränkung der Verarbeitung</h4>
         <p>
             In einer Reihe von Fällen sind Sie berechtigt, von uns eine Einschränkung der Verarbeitung Ihrer
-                personenbezogenen
+            personenbezogenen Daten zu verlangen.<br/>
-                Daten zu verlangen.<br/>
             Im Einzelnen:<br/>
             Sie haben das Recht, von uns die Einschränkung der Verarbeitung zu verlangen, wenn eine der folgenden
-                Voraussetzungen
+            Voraussetzungen gegeben ist:
-                gegeben ist:
         </p>
         <ol>
             <li>die Richtigkeit der personenbezogenen Daten wird von Ihnen bestritten, und zwar für eine Dauer, die es
-                    uns
+                uns ermöglicht, die Richtigkeit der personenbezogenen Daten zu überprüfen,
-                    ermöglicht, die Richtigkeit der personenbezogenen Daten zu überprüfen,
             </li>
             <li>die Verarbeitung unrechtmäßig ist und Sie die Löschung der personenbezogenen Daten ablehnten und
-                    stattdessen die
+                stattdessen die Einschränkung der Nutzung der personenbezogenen Daten verlangt haben;
-                    Einschränkung der Nutzung der personenbezogenen Daten verlangt haben;
             </li>
             <li>wir die personenbezogenen Daten für die Zwecke der Verarbeitung nicht länger benötigen, Sie die Daten
-                    jedoch zur
+                jedoch zur Geltendmachung, Ausübung oder Verteidigung von Rechtsansprüchen benötigen, oder
-                    Geltendmachung, Ausübung oder Verteidigung von Rechtsansprüchen benötigen, oder
             </li>
             <li>Sie Widerspruch gegen die Verarbeitung gemäß Art. 21 Abs. 1 DSGVO eingelegt haben, solange noch nicht
                 feststeht,
@@ -369,29 +285,21 @@ function PrivacyText() {
         <h4>5.5 Recht auf Datenübertragbarkeit</h4>
         <p>
             Sie haben das Recht, Sie betreffende personenbezogene Daten maschinenlesbar zu erhalten, zu übermitteln,
-                oder von uns
+            oder von uns übermitteln zu lasen.<br/>
-                übermitteln zu lasen.<br/>
             Im Einzelnen:<br/>
             Sie haben das Recht, die Sie betreffenden personenbezogenen Daten, die Sie uns bereitgestellt haben, in
-                einem
+            einem strukturierten, gängigen und maschinenlesbaren Format zu erhalten, und Sie haben das Recht, diese
-                strukturierten, gängigen und maschinenlesbaren Format zu erhalten, und Sie haben das Recht, diese Daten
+            Daten einem anderen Verantwortlichen ohne Behinderung durch uns zu übermitteln, sofern </p>
-                einem anderen
-                Verantwortlichen ohne Behinderung durch uns zu übermitteln, sofern
-            </p>
         <ol>
-                <li>die Verarbeitung auf einer Einwilligung gemäß Art. 6 Abs. 1 S. 1 a) DSGVO oder Art. 9 Abs. 2 a) DSGVO
+            <li>die Verarbeitung auf einer Einwilligung gemäß Art. 6 Abs. 1 S. 1 a) DSGVO oder Art. 9 Abs. 2 a)
-                    oder auf
+                DSGVO oder auf einem Vertrag gemäß Art. 6 Abs. 1 S. 1 b) DSGVO beruht und
-                    einem Vertrag gemäß Art. 6 Abs. 1 S. 1 b) DSGVO beruht und
             </li>
             <li>die Verarbeitung mithilfe automatisierter Verfahren erfolgt.</li>
         </ol>
         <p>
-                Bei der Ausübung Ihres Rechts auf Datenübertragbarkeit gemäß Absatz 1 haben Sie das Recht, zu erwirken, dass
+            Bei der Ausübung Ihres Rechts auf Datenübertragbarkeit gemäß Absatz 1 haben Sie das Recht, zu erwirken,
-                die
+            dass die personenbezogenen Daten direkt von uns einem anderen Verantwortlichen übermittelt werden, soweit
-                personenbezogenen Daten direkt von uns einem anderen Verantwortlichen übermittelt werden, soweit dies
+            dies technisch machbar ist. </p>
-                technisch
-                machbar ist.
-            </p>
         <h4>5.6 Widerspruchsrecht</h4>
         <p>
             Sie haben das Recht, auch einer rechtmäßigen Verarbeitung Ihrer personenbezogenen Daten durch uns zu
@@ -400,82 +308,67 @@ function PrivacyText() {
             überwiegen.<br/>
             Im Einzelnen:<br/>
             Sie haben das Recht, aus Gründen, die sich aus Ihrer besonderen Situation ergeben, jederzeit gegen die
-                Verarbeitung
+            Verarbeitung Sie betreffender personenbezogener Daten, die aufgrund von Art. 6 Abs. 1 S. 1 e) oder f) DSGVO
-                Sie betreffender personenbezogener Daten, die aufgrund von Art. 6 Abs. 1 S. 1 e) oder f) DSGVO erfolgt,
+            erfolgt,
-                Widerspruch
+            Widerspruch einzulegen; dies gilt auch für ein auf diese Bestimmungen gestütztes Profiling. Wir verarbeiten
-                einzulegen; dies gilt auch für ein auf diese Bestimmungen gestütztes Profiling. Wir verarbeiten die
+            die personenbezogenen Daten nicht mehr, es sei denn, wir können zwingende schutzwürdige Gründe für die
-                personenbezogenen
+            Verarbeitung nachweisen,
-                Daten nicht mehr, es sei denn, wir können zwingende schutzwürdige Gründe für die Verarbeitung nachweisen,
+            die Ihre Interessen, Rechte und Freiheiten überwiegen, oder die Verarbeitung dient der Geltendmachung,
-                die Ihre
+            Ausübung oder Verteidigung von Rechtsansprüchen.<br/>
-                Interessen, Rechte und Freiheiten überwiegen, oder die Verarbeitung dient der Geltendmachung, Ausübung oder
-                Verteidigung von Rechtsansprüchen.<br/>
             Werden personenbezogene Daten von uns verarbeitet, um Direktwerbung zu betreiben, so haben Sie das Recht,
-                jederzeit
+            jederzeit Widerspruch gegen die Verarbeitung Sie betreffender personenbezogener Daten zum Zwecke derartiger
-                Widerspruch gegen die Verarbeitung Sie betreffender personenbezogener Daten zum Zwecke derartiger Werbung
+            Werbung einzulegen;
-                einzulegen;
             dies gilt auch für das Profiling, soweit es mit solcher Direktwerbung in Verbindung steht.<br/>
             Sie haben das Recht, aus Gründen, die sich aus Ihrer besonderen Situation ergeben, gegen die Sie betreffende
             Verarbeitung Sie betreffender personenbezogener Daten, die zu wissenschaftlichen oder historischen
-                Forschungszwecken
+            Forschungszwecken oder zu statistischen Zwecken gemäß Art. 89 Abs. 1 DSGVO erfolgt, Widerspruch einzulegen,
-                oder zu statistischen Zwecken gemäß Art. 89 Abs. 1 DSGVO erfolgt, Widerspruch einzulegen, es sei denn, die
+            es sei denn,
-                Verarbeitung ist zur Erfüllung einer im öffentlichen Interesse liegenden Aufgabe erforderlich.<br/>
+            die Verarbeitung ist zur Erfüllung einer im öffentlichen Interesse liegenden Aufgabe erforderlich.<br/>
         </p>
         <h4>5.7 Automatisierte Entscheidungen einschließlich Profiling</h4>
         <p>
             Sie haben das Recht, nicht einer ausschließlich auf einer automatisierten Verarbeitung – einschließlich
             Profiling –
             beruhenden Entscheidung unterworfen zu werden, die Ihnen gegenüber rechtliche Wirkung entfaltet oder Sie in
-                ähnlicher
+            ähnlicher Weise erheblich beeinträchtigt.<br/>
-                Weise erheblich beeinträchtigt.<br/>
             Eine automatisierte Entscheidungsfindung auf der Grundlage der erhobenen personenbezogenen Daten findet
-                nicht statt.
+            nicht statt. </p>
-            </p>
         <h4>5.8 Recht auf Widerruf einer datenschutzrechtlichen Einwilligung</h4>
         <p>
-                Sie haben das Recht, eine Einwilligung zur Verarbeitung personenbezogener Daten jederzeit zu widerrufen.
+            Sie haben das Recht, eine Einwilligung zur Verarbeitung personenbezogener Daten jederzeit zu
-            </p>
+            widerrufen. </p>
 
         <h4>5.9 Recht auf Beschwerde bei einer Aufsichtsbehörde</h4>
         <p>
             Sie haben das Recht auf Beschwerde bei einer Aufsichtsbehörde, insbesondere in dem Mitgliedstaat Ihres
             Aufenthaltsorts, Ihres Arbeitsplatzes oder des Orts des mutmaßlichen Verstoßes, wenn Sie der Ansicht sind,
-                dass die
+            dass die Verarbeitung der Sie betreffenden personenbezogenen Daten rechtswidrig ist. </p>
-                Verarbeitung der Sie betreffenden personenbezogenen Daten rechtswidrig ist.
-            </p>
         <h3>6 Datensicherheit</h3>
         <p>
             Wir sind um die Sicherheit Ihrer Daten im Rahmen der geltenden Datenschutzgesetze und technischen
-                Möglichkeiten
+            Möglichkeiten maximal bemüht.<br/>
-                maximal bemüht.<br/>
             Ihre persönlichen Daten werden bei uns verschlüsselt übertragen. Dies gilt für Ihre Bestellungen und auch
-                für das
+            für das Kundenlogin. Wir nutzen das Codierungssystem SSL (Secure Socket Layer), weisen jedoch darauf hin,
-                Kundenlogin. Wir nutzen das Codierungssystem SSL (Secure Socket Layer), weisen jedoch darauf hin, dass die
+            dass die Datenübertragung im Internet (z.B. bei der Kommunikation per E-Mail) Sicherheitslücken aufweisen
-                Datenübertragung im Internet (z.B. bei der Kommunikation per E-Mail) Sicherheitslücken aufweisen kann. Ein
+            kann. Ein lückenloser Schutz der Daten vor dem Zugriff durch Dritte ist nicht möglich.<br/>
-                lückenloser
-                Schutz der Daten vor dem Zugriff durch Dritte ist nicht möglich.<br/>
             Zur Sicherung Ihrer Daten unterhalten wir technische und organisatorische Sicherungsmaßnahmen entsprechend
-                Art. 32
+            Art. 32 DSGVO, die wir immer wieder dem Stand der Technik anpassen.<br/>
-                DSGVO, die wir immer wieder dem Stand der Technik anpassen.<br/>
+            Wir gewährleisten außerdem nicht, dass unser Angebot zu bestimmten Zeiten zur Verfügung steht;
-                Wir gewährleisten außerdem nicht, dass unser Angebot zu bestimmten Zeiten zur Verfügung steht; Störungen,
+            Störungen,
             Unterbrechungen oder Ausfälle können nicht ausgeschlossen werden. Die von uns verwendeten Server werden
-                regelmäßig
+            regelmäßig sorgfältig gesichert. </p>
-                sorgfältig gesichert.
-            </p>
         <h3>7 Weitergabe von Daten an Dritte, keine Datenübertragung ins Nicht-EU-Ausland</h3>
         <p>
             Grundsätzlich verwenden wir Ihre personenbezogenen Daten nur innerhalb unseres Unternehmens.<br/>
             Wenn und soweit wir Dritte im Rahmen der Erfüllung von Verträgen einschalten (etwa Logistik-Dienstleister),
-                erhalten
+            erhalten diese personenbezogene Daten nur in dem Umfang, in welchem die Übermittlung für die entsprechende
-                diese personenbezogene Daten nur in dem Umfang, in welchem die Übermittlung für die entsprechende Leistung
+            Leistung erforderlich ist.<br/>
-                erforderlich ist.<br/>
             Für den Fall, dass wir bestimmte Teile der Datenverarbeitung auslagern („Auftragsverarbeitung“),
-                verpflichten wir
+            verpflichten wir Auftragsverarbeiter vertraglich dazu, personenbezogene Daten nur im Einklang mit den
-                Auftragsverarbeiter vertraglich dazu, personenbezogene Daten nur im Einklang mit den Anforderungen der
+            Anforderungen der Datenschutzgesetze zu verwenden und den Schutz der Rechte der betroffenen Person zu
-                Datenschutzgesetze zu verwenden und den Schutz der Rechte der betroffenen Person zu gewährleisten.<br/>
+            gewährleisten.<br/>
             Eine Datenübertragung an Stellen oder Personen außerhalb der EU außerhalb des in dieser Erklärung in Ziffer
-                4
+            4 genannten Falls findet nicht statt und ist nicht geplant. </p>
-                genannten Falls findet nicht statt und ist nicht geplant.
-            </p>
         <h3>8 Datenschutzbeauftragter</h3>
         <p>
             Sollten Sie noch Fragen oder Bedenken zum Datenschutz haben, so wenden Sie sich bitte an unseren
@@ -486,17 +379,14 @@ function PrivacyText() {
             August-Euler-Weg 3<br/>
             76133 Karlsruhe<br/>
             Germany<br/>
-                jon@s-seydel.de
+            jon@s-seydel.de </p>
-            </p>
+    </Container>);
-        </Container>
-    );
 }
 
 
 export default class PrivacyPage extends React.Component {
     render() {
-        return (
+        return (<div>
-            <div>
             <Head>
                 <title>Datenschutzerklärung: turnie.re</title>
             </Head>
@@ -504,7 +394,6 @@ export default class PrivacyPage extends React.Component {
             <BigImage text="Datenschutzerklärung"/>
             <Main/>
             <Footer/>
-            </div>
+        </div>);
-        );
     }
 }

pages/private.js

@@ -16,8 +16,7 @@ class PrivateTournamentsPage extends React.Component {
     render() {
         const {isSignedIn} = this.props;
 
-        return (
+        return (<UserRestrictor>
-            <UserRestrictor>
             <Option condition={isSignedIn}>
                 <div className="main generic-fullpage-bg">
                     <Head>
@@ -41,8 +40,7 @@ class PrivateTournamentsPage extends React.Component {
                     <Footer/>
                 </div>
             </Option>
-            </UserRestrictor>
+        </UserRestrictor>);
-        );
     }
 }
 
@@ -51,9 +49,7 @@ function mapStateToProperties(state) {
     return {isSignedIn};
 }
 
-const PrivateTournamentListPage = connect(
+const PrivateTournamentListPage = connect(mapStateToProperties)(PrivateTournamentsPage);
-    mapStateToProperties,
-)(PrivateTournamentsPage);
 
 export default PrivateTournamentListPage;
 
@@ -70,13 +66,11 @@ function PrivateTournamentsPageContent() {
 
 class PrivateTournamentsCard extends React.Component {
     render() {
-        return (
+        return (<Card className="shadow">
-            <Card className="shadow">
             <CardBody>
                 <h1 className="custom-font">Private Turniere</h1>
                 <TournamentList type='private'/>
             </CardBody>
-            </Card>
+        </Card>);
-        );
     }
 }

pages/register.js

@@ -2,15 +2,7 @@ import Head from 'next/head';
 import React from 'react';
 import {connect} from 'react-redux';
 import {
-    Button,
+    Button, Card, CardBody, Container, Form, FormGroup, FormText, Input, Label
-    Card,
-    CardBody,
-    Container,
-    Form,
-    FormGroup,
-    FormText,
-    Input,
-    Label
 } from 'reactstrap';
 
 import {TurniereNavigation} from '../js/components/Navigation';
@@ -22,8 +14,7 @@ import '../static/everypage.css';
 
 export default class RegisterPage extends React.Component {
     render() {
-        return (
+        return (<div className="main generic-fullpage-bg">
-            <div className="main generic-fullpage-bg">
             <Head>
                 <title>Registrieren: turnie.re</title>
             </Head>
@@ -33,15 +24,13 @@ export default class RegisterPage extends React.Component {
                 <AccountRequirementMarketing/>
             </div>
             <Footer/>
-            </div>
+        </div>);
-        );
     }
 }
 
 class Register extends React.Component {
     render() {
-        return (
+        return (<Container className="py-5">
-            <Container className="py-5">
             <Card className="shadow">
                 <CardBody>
                     <h1 className="custom-font">Account anlegen</h1>
@@ -51,8 +40,7 @@ class Register extends React.Component {
                     </div>
                 </CardBody>
             </Card>
-            </Container>
+        </Container>);
-        );
     }
 }
 
@@ -60,13 +48,9 @@ class RegisterErrorList extends React.Component {
     render() {
         const {error, errorMessages} = this.props;
         if (error) {
-            return (
+            return (<ul className="mt-3 error-box">
-                <ul className="mt-3 error-box">
+                {errorMessages.map((message, index) => <li key={index}>{message}</li>)}
-                    { errorMessages.map((message, index) =>
+            </ul>);
-                        <li key={index}>{message}</li>
-                    ) }
-                </ul>
-            );
         } else {
             return null;
         }
@@ -78,46 +62,43 @@ const mapStateToErrorMessages = state => {
     return {errorMessages, error};
 };
 
-const VisibleRegisterErrorList = connect(
+const VisibleRegisterErrorList = connect(mapStateToErrorMessages)(RegisterErrorList);
-    mapStateToErrorMessages
-)(RegisterErrorList);
 
 class RegisterForm extends React.Component {
     constructor(props) {
         super(props);
 
         this.state = {
-            username: '',
+            username: '', email: '', password: ''
-            email: '',
-            password: ''
         };
     }
 
     render() {
-        return (
+        return (<Form>
-            <Form>
             <FormGroup>
                 <Label for="username">Benutzername</Label>
-                    <Input name="username" value={this.state.username} onChange={ this.handleUsernameInput.bind(this) } />
+                <Input name="username" value={this.state.username} onChange={this.handleUsernameInput.bind(this)}/>
                 <FormText>Wenn du anderen dein Turnier zeigst, können sie deinen Benutzernamen sehen.</FormText>
             </FormGroup>
             <FormGroup>
                 <Label for="email">E-Mail-Adresse</Label>
-                    <Input type="email" name="email" value={this.state.email} onChange={ this.handleEmailInput.bind(this) } />
+                <Input type="email" name="email" value={this.state.email}
+                    onChange={this.handleEmailInput.bind(this)}/>
                 <FormText>Deine E-Mail-Adresse kann nur von dir gesehen werden.</FormText>
             </FormGroup>
             <FormGroup>
                 <Label for="password">Passwort</Label>
-                    <Input type="password" name="password" value={this.state.password} onChange={ this.handlePasswordInput.bind(this) } />
+                <Input type="password" name="password" value={this.state.password}
+                    onChange={this.handlePasswordInput.bind(this)}/>
                 <FormText>Dein Passwort muss mindestens 12 Zeichen lang sein. Alle Zeichen sind erlaubt.</FormText>
             </FormGroup>
             <FormText className="mb-2 mt-4">
                     Du akzeptierst die <a href="/privacy">Datenschutzbestimmungen</a>, wenn du auf Registrieren klickst.
             </FormText>
-                <Button onClick={ register.bind(this, this.state.username, this.state.email, this.state.password) } color="success" size="lg" className="w-100 shadow-sm">Registrieren</Button>
+            <Button onClick={register.bind(this, this.state.username, this.state.email, this.state.password)}
+                color="success" size="lg" className="w-100 shadow-sm">Registrieren</Button>
             <VisibleRegisterErrorList/>
-            </Form>
+        </Form>);
-        );
     }
 
     handlePasswordInput(input) {
@@ -134,14 +115,12 @@ class RegisterForm extends React.Component {
 }
 
 function AccountRequirementMarketing() {
-    return (
+    return (<Container>
-        <Container>
         <Card id="account-requirement">
             <CardBody>
                 <h3 className="custom-font">Warum ein Account nötig ist</h3>
                 <p>Du benötigst deinen Account, damit nur du dein Turnier bearbeiten kannst.</p>
             </CardBody>
         </Card>
-        </Container>
+    </Container>);
-    );
 }

pages/tournament-edit.js

@@ -3,11 +3,7 @@ import React from 'react';
 import {connect} from 'react-redux';
 import {notify} from 'react-notify-toast';
 import {
-    Container,
+    Container, Button, Card, CardBody, Table
-    Button,
-    Card,
-    CardBody,
-    Table
 } from 'reactstrap';
 
 import {requestTournament} from '../js/api';
@@ -53,26 +49,25 @@ class EditTournamentPage extends React.Component {
         const {validCode} = this.state;
         const {tournamentname, ownerUsername, isSignedIn, username} = this.props;
 
-        return (
+        return (<UserRestrictor>
-            <UserRestrictor>
+            <Option condition={validCode && isSignedIn && ownerUsername === username}>
-                <Option condition={ validCode && isSignedIn && ownerUsername === username }>
                 <div className='pb-5'>
                     <Head>
                         <title>Turnie.re - Turnier bearbeiten</title>
                     </Head>
                     <TurniereNavigation/>
 
-                        <BigImage text={ tournamentname }/>
+                    <BigImage text={tournamentname}/>
                     <EditTournamentContent ref={edittournamentcontent => {
                         this._edittournamentcontent = edittournamentcontent;
                     }}/>
                     <Footer/>
                 </div>
             </Option>
-                <Option condition={ validCode && isSignedIn }>
+            <Option condition={validCode && isSignedIn}>
-                    <ErrorPageComponent statusCode={ 403 }/>
+                <ErrorPageComponent statusCode={403}/>
             </Option>
-                <Option condition={ !isSignedIn }>
+            <Option condition={!isSignedIn}>
                 <div className="main generic-fullpage-bg">
                     <Head>
                         <title>Turnie.re - Turnier bearbeiten</title>
@@ -86,10 +81,9 @@ class EditTournamentPage extends React.Component {
                 </div>
             </Option>
             <Option condition={true}>
-                    <ErrorPageComponent statusCode={ 404 }/>
+                <ErrorPageComponent statusCode={404}/>
             </Option>
-            </UserRestrictor>
+        </UserRestrictor>);
-        );
     }
 }
 
@@ -99,14 +93,11 @@ function mapStateToTournamentInfo(state) {
     return {tournamentname, ownerUsername, isSignedIn, username};
 }
 
-export default connect(
+export default connect(mapStateToTournamentInfo)(EditTournamentPage);
-    mapStateToTournamentInfo
-)(EditTournamentPage);
 
 class EditTournamentContent extends React.Component {
     render() {
-        return (
+        return (<div className='mb-5'>
-            <div className='mb-5'>
             <ReturnToTournamentButton/>
             <EditTournamentPropertiesField ref={field => {
                 this._edittournamentpropertiesfield = field;
@@ -114,8 +105,7 @@ class EditTournamentContent extends React.Component {
             <EditTeamField ref={field => {
                 this._editteamfield = field;
             }}/>
-            </div>
+        </div>);
-        );
     }
 
     notifyOfContentUpdate() {
@@ -125,25 +115,21 @@ class EditTournamentContent extends React.Component {
 }
 
 function ReturnToTournamentButton() {
-    return (
+    return (<Container className="px-0">
-        <Container className="px-0">
         <Button color="secondary" className="mb-5 w-100" href="./">Zurück zum Turnier</Button>
-        </Container>
+    </Container>);
-    );
 }
 
 class EditTournamentPropertiesField extends React.Component {
     render() {
-        return (
+        return (<Card className="container">
-            <Card className="container">
             <CardBody>
                 <h2>Turnier-Eigenschaften ändern</h2>
                 <VisibleEditTournamentForm ref={form => {
                     this._visibleedittournamentform = form;
                 }}/>
             </CardBody>
-            </Card>
+        </Card>);
-        );
     }
 
     notifyOfContentUpdate() {
@@ -156,45 +142,45 @@ class EditTournamentForm extends React.Component {
         super(props);
 
         this.state = {
-            name: '',
+            name: '', description: '', isPublic: false
-            description: '',
-            isPublic: false
         };
     }
 
     render() {
         const {name, description, isPublic} = this.state;
 
-        return (
+        return (<div>
-            <div>
             <div className="form-group">
                 <label htmlFor="name">Turnier-Name</label>
-                    <input className="form-control" type="text" name="name" id="edittournament-textfield-name" value={ name } placeholder={ name } onChange={ this.handleNameInput.bind(this) } />
+                <input className="form-control" type="text" name="name" id="edittournament-textfield-name"
+                    value={name} placeholder={name} onChange={this.handleNameInput.bind(this)}/>
             </div>
             <div className="form-group">
                 <label htmlFor="name">Turnier-Beschreibung</label>
-                    <input className="form-control" type="text" name="name" id="edittournament-textfield-description" value={ description } placeholder={ description } onChange={ this.handleDescriptionInput.bind(this) } />
+                <input className="form-control" type="text" name="name" id="edittournament-textfield-description"
+                    value={description} placeholder={description}
+                    onChange={this.handleDescriptionInput.bind(this)}/>
             </div>
             <div className="form-group custom-control custom-checkbox">
-                    <input className="custom-control-input" type="checkbox" name="isPublic" id="edittournament-checkbox-isPublic" value={ isPublic } onChange={ this.handlePublicInput.bind(this) } />
+                <input className="custom-control-input" type="checkbox" name="isPublic"
+                    id="edittournament-checkbox-isPublic" value={isPublic}
+                    onChange={this.handlePublicInput.bind(this)}/>
                 <label htmlFor="isPublic" className="custom-control-label">Das Turnier öffentlich anzeigen</label>
             </div>
             <div className="form-group">
                 <div className="input-group">
-                        <Button color="success" className="px-5" id="edittournament-button" onClick={ this.handleClick.bind(this) }>Ändern</Button>
+                    <Button color="success" className="px-5" id="edittournament-button"
+                        onClick={this.handleClick.bind(this)}>Ändern</Button>
                 </div>
             </div>
-            </div>
+        </div>);
-        );
     }
 
     notifyOfContentUpdate() {
         const {name, description, isPublic} = this.props;
 
         this.setState({
-            name: name? name : '',
+            name: name ? name : '', description: description ? description : '', isPublic: isPublic
-            description: description? description : '',
-            isPublic: isPublic
         });
     }
 
@@ -220,23 +206,19 @@ function mapStateToTournamentFormProps(state) {
     return {name, description, isPublic};
 }
 
-const VisibleEditTournamentForm = connect(
+const VisibleEditTournamentForm = connect(mapStateToTournamentFormProps, null, null,
-    mapStateToTournamentFormProps,
+    {withRef: true})(EditTournamentForm);
-    null, null, {withRef: true}
-)(EditTournamentForm);
 
 class EditTeamField extends React.Component {
     render() {
-        return (
+        return (<Card className="container my-4">
-            <Card className="container my-4">
             <CardBody>
                 <h2>Team-Namen ändern</h2>
                 <VisibleEditTeamNamesForm ref={form => {
                     this._visibleeditteamnamesform = form;
                 }}/>
             </CardBody>
-            </Card>
+        </Card>);
-        );
     }
 
     notifyOfContentUpdate() {
@@ -256,22 +238,21 @@ class EditTeamNamesForm extends React.Component {
     render() {
         const {teams} = this.state;
 
-        return (
+        return (<div>
-            <div>
             <Table className="table-striped mt-3">
                 <tbody>
-                        {
+                    {teams.map((team, index) => <tr key={index}>
-                            teams.map((team, index) =>
+                        <td><Button outline size="sm" className="changeTeamnameButton"
-                                <tr key={index}>
+                            id={'editteam-button-team_' + team.id}
-                                    <td><Button outline size="sm" className="changeTeamnameButton" id={ 'editteam-button-team_' + team.id } onClick={ this.handleClick.bind(this, index) }>Ändern</Button></td>
+                            onClick={this.handleClick.bind(this, index)}>Ändern</Button></td>
-                                    <td className="w-100"><input className="form-control" type="text" id={ 'editteam-textfield-team_' + team.id } value={ team.name } placeholder={ team.name } onChange={ this.handleNameInput.bind(this, index) } /></td>
+                        <td className="w-100"><input className="form-control" type="text"
-                                </tr>
+                            id={'editteam-textfield-team_' + team.id} value={team.name}
-                            )
+                            placeholder={team.name}
-                        }
+                            onChange={this.handleNameInput.bind(this, index)}/></td>
+                    </tr>)}
                 </tbody>
             </Table>
-            </div>
+        </div>);
-        );
     }
 
     notifyOfContentUpdate() {
@@ -306,8 +287,5 @@ function mapStateToTeamFormProps(state) {
     return {teams};
 }
 
-const VisibleEditTeamNamesForm = connect(
+const VisibleEditTeamNamesForm = connect(mapStateToTeamFormProps, null, null, {withRef: true})(EditTeamNamesForm);
-    mapStateToTeamFormProps,
-    null, null, {withRef: true}
-)(EditTeamNamesForm);
 

pages/tournament-fullscreen.js

@@ -7,15 +7,13 @@ class FullscreenTournamentPage extends React.Component {
     }
 
     render() {
-        return (
+        return (<div>
-            <div>
             <Head>
                 <title>Turnie.re - Turnieranzeige (Vollbild)</title>
             </Head>
             <p>Turnieranzeige (Vollbild)</p>
             <p>Code: {this.props.query.code}</p>
-            </div>
+        </div>);
-        );
     }
 }
 

pages/tournament.js

@@ -25,8 +25,7 @@ import {Footer} from '../js/components/Footer';
 import {TurniereNavigation} from '../js/components/Navigation';
 import {BigImage} from '../js/components/BigImage';
 import {
-    getRequest,
+    getRequest, getState
-    getState
 } from '../js/api';
 
 import 'bootstrap/dist/css/bootstrap.min.css';
@@ -40,8 +39,7 @@ class PrivateTournamentPage extends React.Component {
         const {isSignedIn, username} = this.props;
 
         // TODO: Change href-prop of the anchor tag to contain the tournament code
-        return (
+        return (<div className='pb-5'>
-            <div className='pb-5'>
             <Container>
                 <EditButton id={id} ownerName={ownerUsername} isSignedIn={isSignedIn} username={username}/>
                 <p>{description}</p>
@@ -54,11 +52,11 @@ class PrivateTournamentPage extends React.Component {
                 </ListGroup>
             </Container>
             <div className='stages pt-5'>
-                    {playoffStages.map(stage =>
+                {playoffStages.map(stage => <Stage isSignedIn={isSignedIn} isOwner={username === ownerUsername}
-                        <Stage isSignedIn={isSignedIn} isOwner={username === ownerUsername} level={getLevelName(stage.level)} matches={stage.matches} key={stage.level}/>)}
+                    level={getLevelName(stage.level)} matches={stage.matches}
+                    key={stage.level}/>)}
             </div>
-            </div>
+        </div>);
-        );
     }
 }
 
@@ -67,17 +65,13 @@ function mapStateToTournamentPageProperties(state) {
     return {isSignedIn, username};
 }
 
-const TournamentPage = connect(
+const TournamentPage = connect(mapStateToTournamentPageProperties)(PrivateTournamentPage);
-    mapStateToTournamentPageProperties
-)(PrivateTournamentPage);
 
 function EditButton(props) {
     const {id, ownerName, isSignedIn, username} = props;
 
     if (isSignedIn && ownerName === username) {
-        return (
+        return (<a href={'/t/' + id + '/edit'} className='btn btn-outline-secondary'>Turnier bearbeiten</a>);
-            <a href={'/t/' + id + '/edit'} className='btn btn-outline-secondary'>Turnier bearbeiten</a>
-        );
     } else {
         return null;
     }
@@ -100,8 +94,8 @@ function Stage(props) {
             <h1 className='custom-font'>{props.level}</h1>
             <Row>
                 {props.matches.map((match => (
-                    <Col className='minw-25' key={match.id}><Match match={match} isSignedIn={isSignedIn} isOwner={isOwner}/></Col>
+                    <Col className='minw-25' key={match.id}><Match match={match} isSignedIn={isSignedIn}
-                )))}
+                        isOwner={isOwner}/></Col>)))}
             </Row>
         </Container>
     </div>);
@@ -125,7 +119,9 @@ class Match extends React.Component {
     }
 
     render() {
-        let cardClass; let smallMessage; let borderClass;
+        let cardClass;
+        let smallMessage;
+        let borderClass;
         // possible states: single_team not_ready not_started in_progress team1_won team2_won undecided
         switch (this.props.match.state) {
         case 'in_progress':
@@ -160,8 +156,7 @@ class Match extends React.Component {
             smallMessage = 'Spiel beendet, unentschieden';
             break;
         }
-        return (
+        return (<div className='mb-3'>
-            <div className='mb-3'>
             <Card className='shadow-sm match' onClick={this.toggleModal}>
                 <CardBody className={borderClass + ' border py-2 ' + cardClass}>
                     <MatchTable match={this.props.match} borderColor={borderClass}/>
@@ -169,8 +164,7 @@ class Match extends React.Component {
             </Card>
             <small className='text-muted'>{smallMessage}</small>
             <MatchModal title='Match' isOpen={this.state.modal} toggle={this.toggleModal} match={this.props.match}/>
-            </div>
+        </div>);
-        );
     }
 }
 
@@ -203,8 +197,7 @@ function MatchModal(props) {
         title = 'Spiel beendet';
         break;
     }
-    return (
+    return (<Modal isOpen={props.isOpen} toggle={props.toggle}>
-        <Modal isOpen={props.isOpen} toggle={props.toggle}>
         <ModalHeader toggle={props.toggle}>{title}</ModalHeader>
         <ModalBody>
             {props.match.state === 'in_progress' ? <EditableMatchTable match={props.match}/> :
@@ -214,12 +207,12 @@ function MatchModal(props) {
             {actionButton}
             <Button color='secondary' onClick={props.toggle}>Abbrechen</Button>
         </ModalFooter>
-        </Modal>
+    </Modal>);
-    );
 }
 
 function MatchTable(props) {
-    let team1Class; let team2Class;
+    let team1Class;
+    let team2Class;
     // possible states: single_team not_ready not_started in_progress team1_won team2_won undecided
     switch (props.match.state) {
     case 'in_progress':
@@ -243,8 +236,7 @@ function MatchTable(props) {
         break;
     }
     if (props.match.state === 'single_team') {
-        return (
+        return (<Table className='mb-0'>
-            <Table className='mb-0'>
             <tbody>
                 <tr>
                     <td className={'border-top-0 ' + team1Class}>{props.match.team1}</td>
@@ -253,11 +245,9 @@ function MatchTable(props) {
                     <td className={props.borderColor + ' ' + team2Class}>kein Gegner</td>
                 </tr>
             </tbody>
-            </Table>
+        </Table>);
-        );
     } else {
-        return (
+        return (<Table className='mb-0'>
-            <Table className='mb-0'>
             <tbody>
                 <tr>
                     <th className='stage border-top-0'>{props.match.scoreTeam1}</th>
@@ -268,14 +258,12 @@ function MatchTable(props) {
                     <td className={props.borderColor + ' ' + team2Class}>{props.match.team2}</td>
                 </tr>
             </tbody>
-            </Table>
+        </Table>);
-        );
     }
 }
 
 function EditableMatchTable(props) {
-    return (
+    return (<Table className='mb-0'>
-        <Table className='mb-0'>
         <tbody>
             <tr>
                 <td className='scoreInput border-top-0'>
@@ -290,8 +278,7 @@ function EditableMatchTable(props) {
                 <td className='align-middle'>{props.match.team2}</td>
             </tr>
         </tbody>
-        </Table>
+    </Table>);
-    );
 }
 
 class ScoreInput extends React.Component {
@@ -317,9 +304,12 @@ class ScoreInput extends React.Component {
 
     render() {
         return (<InputGroup>
-            <InputGroupAddon addonType="prepend"><Button onClick={this.decreaseScore} color='danger' outline={true}>-1</Button></InputGroupAddon>
+            <InputGroupAddon addonType="prepend"><Button onClick={this.decreaseScore} color='danger'
-            <Input className='font-weight-bold' value={this.state.score} onChange={this.updateScore} type='number' step='1' placeholder='0'/>
+                outline={true}>-1</Button></InputGroupAddon>
-            <InputGroupAddon addonType="append"><Button onClick={this.increaseScore} color='success'>+1</Button></InputGroupAddon>
+            <Input className='font-weight-bold' value={this.state.score} onChange={this.updateScore} type='number'
+                step='1' placeholder='0'/>
+            <InputGroupAddon addonType="append"><Button onClick={this.increaseScore}
+                color='success'>+1</Button></InputGroupAddon>
         </InputGroup>);
     }
 }
@@ -334,9 +324,7 @@ function convertTournament(apiTournament) {
         } else {
             // playoff stage
             playoffStages.push({
-                id: stage.id,
+                id: stage.id, level: stage.level, matches: stage.matches.map(match => convertMatch(match))
-                level: stage.level,
-                matches: stage.matches.map(match => convertMatch(match))
             });
         }
     }
@@ -363,8 +351,7 @@ function convertGroup(apiGroup) {
 
 function convertMatch(apiMatch) {
     const result = {
-        id: apiMatch.id,
+        id: apiMatch.id, state: apiMatch.state
-        state: apiMatch.state
     };
 
     if (apiMatch.match_scores.length === 2) {
@@ -423,8 +410,7 @@ class Main extends React.Component {
         const {status, tournament} = this.state;
 
         if (status === 200) {
-            return (
+            return (<div>
-                <div>
                 <Head>
                     <title>{tournamentName}: turnie.re</title>
                 </Head>
@@ -432,8 +418,7 @@ class Main extends React.Component {
                 <BigImage text={tournamentName}/>
                 <TournamentPage tournament={tournament}/>
                 <Footer/>
-                </div>
+            </div>);
-            );
         } else {
             return <ErrorPageComponent code={status}/>;
         }