new front page

[alttp.git] / resources / js / components / pages / Front.js

diff --git a/resources/js/components/pages/Front.js b/resources/js/components/pages/Front.js
index aa4b333afce9e8087dc8443973fb178f53012e56..26078696bac6262901ad4629d40ca5c480161450 100644 (file)
--- a/resources/js/components/pages/Front.js
+++ b/resources/js/components/pages/Front.js
@@ -1,7 +1,38 @@
 import React from 'react';
+import { Button, Col, Container, Image, Row } from 'react-bootstrap';
+import { useNavigate } from 'react-router-dom';
 
-const Front = () => <div className="mt-5 text-center">
-       <h1>It&apos;s a mystery to everyone.</h1>
-</div>;
+const Front = () => {
+       const navigate = useNavigate();
+
+       return <Container className="mt-5">
+               <Row>
+                       <Col md={6}>
+                               <Button
+                                       className="front-panel"
+                                       onClick={() => navigate('/tournaments/6')}
+                                       variant="outline-secondary"
+                               >
+                                       <Image alt="" className="image" src="/media/alttp/front.png" />
+                                       <div className="title">
+                                               ALttPR Weekly
+                                       </div>
+                               </Button>
+                       </Col>
+                       <Col md={6}>
+                               <Button
+                                       className="front-panel"
+                                       onClick={() => navigate('/tournaments/5')}
+                                       variant="outline-secondary"
+                               >
+                                       <Image alt="" className="image" src="/media/sm/front.png" />
+                                       <div className="title">
+                                               Super Metroid
+                                       </div>
+                               </Button>
+                       </Col>
+               </Row>
+       </Container>;
+};
 
 export default Front;