new front page

diff --git a/resources/js/components/App.js b/resources/js/components/App.js
index cd21ed0e31e90d6dff4e2e11dbf268329d324176..0d11f902641a365d526fe4ca71321f775e7f9bba 100644 (file)
--- a/resources/js/components/App.js
+++ b/resources/js/components/App.js
@@ -4,6 +4,7 @@ import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom';
 
 import Header from './common/Header';
 import AlttpSeed from './pages/AlttpSeed';
+import Front from './pages/Front';
 import Technique from './pages/Technique';
 import Tournament from './pages/Tournament';
 import User from './pages/User';
@@ -59,7 +60,8 @@ const App = () => {
                                        <Route path="tech/:name" element={<Technique />} />
                                        <Route path="tournaments/:id" element={<Tournament />} />
                                        <Route path="users/:id" element={<User />} />
-                                       <Route path="*" element={<Navigate to="/tournaments/5" />} />
+                                       <Route path="/" element={<Front />} />
+                                       <Route path="*" element={<Navigate to="/" />} />
                                </Routes>
                        </UserContext.Provider>
                </AlttpBaseRomProvider>

diff --git a/resources/js/components/common/Header.js b/resources/js/components/common/Header.js
index 530008147c9437f863446fded1a720e17b3b19ba..96106a175491a142488ee8e2b903beec945b24da 100644 (file)
--- a/resources/js/components/common/Header.js
+++ b/resources/js/components/common/Header.js
@@ -19,14 +19,9 @@ const Header = ({ doLogout, user }) =>
                                </Navbar.Brand>
                        </LinkContainer>
                        <Nav>
-                               <LinkContainer to="/tournaments/1">
-                                       <Nav.Link href="/tournaments/1">
-                                               Season 1
-                                       </Nav.Link>
-                               </LinkContainer>
-                               <LinkContainer to="/tournaments/4">
-                                       <Nav.Link href="/tournaments/4">
-                                               Season 2
+                               <LinkContainer to="/tournaments/6">
+                                       <Nav.Link href="/tournaments/6">
+                                               ALttPR Weekly
                                        </Nav.Link>
                                </LinkContainer>
                                <LinkContainer to="/tournaments/5">

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;

diff --git a/resources/sass/app.scss b/resources/sass/app.scss
index 64f81df2198600694999ce90b1f4feca154ca82b..d0506074f5c4b0acd9a61480740df6f95fd97624 100644 (file)
--- a/resources/sass/app.scss
+++ b/resources/sass/app.scss
@@ -14,6 +14,7 @@
 @import 'common';
 @import 'discord';
 @import 'form';
+@import 'front';
 @import 'participants';
 @import 'results';
 @import 'rounds';

diff --git a/resources/sass/front.scss b/resources/sass/front.scss
new file mode 100644 (file)
index 0000000..5f81f46
--- /dev/null
+++ b/resources/sass/front.scss
@@ -0,0 +1,13 @@
+.front-panel {
+       display: block;
+       font-size: 200%;
+       font-weight: bold;
+       margin: 3em 0;
+       width: 100%;
+
+       .image img {
+               border-radius: 2em;
+               width: 100%;
+               height: auto;
+       }
+}