From 9836356ed10e762b6f7fdd79cab1316bf146aa8d Mon Sep 17 00:00:00 2001
From: Sendou <sendou77@gmail.com>
Date: Sun, 13 Oct 2019 00:00:46 +0300
Subject: [PATCH] new layout with smaller footer

---
 react-ui/src/components/root/App.js    |  9 ++++-
 react-ui/src/components/root/Footer.js | 54 ++++----------------------
 2 files changed, 15 insertions(+), 48 deletions(-)

diff --git a/react-ui/src/components/root/App.js b/react-ui/src/components/root/App.js
index 63581f1d9..a26c01040 100644
--- a/react-ui/src/components/root/App.js
+++ b/react-ui/src/components/root/App.js
@@ -8,7 +8,14 @@ const App = () => {
   return (
     <div style={{ paddingTop: "0.3em" }}>
       <MainMenu />
-      <div style={{ background: "white", padding: "1.5em" }}>
+      <div
+        style={{
+          background: "white",
+          padding: "1.5em",
+          margin: "0.5em 2em 0.5em 2em",
+          borderRadius: "7px"
+        }}
+      >
         <Container>
           <Routes />
         </Container>
diff --git a/react-ui/src/components/root/Footer.js b/react-ui/src/components/root/Footer.js
index cb8af0309..45e92ca4e 100644
--- a/react-ui/src/components/root/Footer.js
+++ b/react-ui/src/components/root/Footer.js
@@ -11,58 +11,18 @@ import RollSim from "./RollSim"
 
 const Footer = () => {
   return (
-    <Segment inverted vertical style={{ padding: "5em 0em" }}>
+    <Segment vertical style={{ padding: "1em 0em" }}>
       <Container textAlign="center">
-        <Grid divided inverted stackable>
-          <Grid.Column width={3}>
-            <Header inverted as="h4" content="Popular on sendou.ink" />
-            <List link inverted>
-              <List.Item as="a">Builds</List.Item>
-              <List.Item as="a">Map Planner</List.Item>
-              <List.Item as="a">X Rank Search</List.Item>
-              <List.Item as="a">Rotations</List.Item>
-            </List>
-          </Grid.Column>
-          <Grid.Column width={3}>
-            <Header inverted as="h4" content="Follow Sendou" />
-            <List link inverted>
-              <List.Item as="a" href="https://twitter.com/sendouc">
-                Twitter
-              </List.Item>
-              <List.Item as="a" href="https://www.twitch.tv/sendou">
-                Twitch
-              </List.Item>
-              <List.Item as="a" href="https://www.youtube.com/sendou">
-                YouTube
-              </List.Item>
-              <List.Item as="a" href="https://discordapp.com/invite/J6NqUvt">
-                Discord
-              </List.Item>
-            </List>
-          </Grid.Column>
-          <Grid.Column width={3}>
-            <Header inverted as="h4" content="Splatoon elsewhere" />
-            <List link inverted>
-              <List.Item as="a" href="https://splatoonwiki.org/">
-                Inkipedia
-              </List.Item>
-              <List.Item as="a" href="https://stat.ink/">
-                stat.ink
-              </List.Item>
-              <List.Item as="a">Links</List.Item>
-              <List.Item as="a">More</List.Item>
-            </List>
-          </Grid.Column>
-          <Grid.Column width={4}>
-            <RollSim />
-          </Grid.Column>
-        </Grid>
-
-        <Divider inverted section />
         <List horizontal inverted divided link size="small">
+          <List.Item as="a" href="#">
+            About
+          </List.Item>
           <List.Item as="a" href="#">
             View Source on Github
           </List.Item>
+          <List.Item as="a" href="#">
+            Join the community on Discord
+          </List.Item>
           <List.Item as="a" href="#">
             Thanks to
           </List.Item>