+import React from 'react';
+import { Button, Col, Container, Row } from 'react-bootstrap';
+import { withTranslation } from 'react-i18next';
+
+import Icon from '../common/Icon';
+import i18n from '../../i18n';
+
+const AosFront = () => <Container>
+ <div className="my-5 text-center">
+ <h1>Castlevania: Aria of Sorrow</h1>
+ </div>
+ <Row>
+ <Col className="text-center mb-3" sm={6} md={4}>
+ <Button
+ href="https://discord.gg/VEtVYNr"
+ size="lg"
+ target="_blank"
+ variant="discord"
+ >
+ <Icon.DISCORD />
+ {' '}
+ {i18n.t('aos.randoDiscord')}
+ </Button>
+ </Col>
+ <Col className="text-center mb-3" sm={6} md={4}>
+ <Button
+ href="https://aosrando.surge.sh/"
+ size="lg"
+ target="_blank"
+ variant="primary"
+ >
+ {i18n.t('aos.randoWeb')}
+ </Button>
+ </Col>
+ <Col className="text-center mb-3" sm={6} md={4}>
+ <Button
+ href="https://discord.gg/ApVyJnd"
+ size="lg"
+ target="_blank"
+ variant="discord"
+ >
+ <Icon.DISCORD />
+ {' '}
+ {i18n.t('aos.tourneyDiscord')}
+ </Button>
+ </Col>
+ <Col className="text-center mb-3" sm={6} md={4}>
+ <Button
+ href="https://discord.com/oauth2/authorize?client_id=951113702839549982&scope=bot%20applications.commands"
+ size="lg"
+ target="_blank"
+ variant="discord"
+ >
+ <Icon.DISCORD />
+ {' '}
+ {i18n.t('aos.inviteBot')}
+ </Button>
+ </Col>
+ <Col className="text-center mb-3" sm={6} md={4}>
+ <Button
+ href="https://discord.com/oauth2/authorize?client_id=951113702839549982&scope=applications.commands"
+ size="lg"
+ target="_blank"
+ variant="discord"
+ >
+ <Icon.DISCORD />
+ {' '}
+ {i18n.t('aos.inviteCommand')}
+ </Button>
+ </Col>
+ </Row>
+</Container>;
+
+export default withTranslation()(AosFront);