diff --git a/package.json b/package.json
index 79247d8..280449c 100644
--- a/package.json
+++ b/package.json
@@ -6,6 +6,7 @@
"@emotion/core": "^10.0.10",
"@emotion/styled": "^10.0.10",
"babel-plugin-emotion": "^10.0.9",
+ "date-fns": "^1.30.1",
"firebase": "^5.9.0",
"react": "^16.8.4",
"react-dom": "^16.8.4",
diff --git a/src/App.js b/src/App.js
index fe61bf0..287c657 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,5 +1,6 @@
import React, { Component } from "react";
import { BrowserRouter as Router, Route } from "react-router-dom";
+import styled from "@emotion/styled";
import logo from "./logo.svg";
import "./App.css";
@@ -13,6 +14,11 @@ import Register from "./components/screens/Register";
import { withAuthentication } from "./components/session";
+const RouteLayout = styled.div`
+ margin: 0 auto;
+ max-width: 720px;
+`;
+
class App extends Component {
state = {
authUser: JSON.parse(localStorage.getItem("authUser"))
@@ -23,12 +29,14 @@ class App extends Component {
return (
-
-
-
-
-
-
+
+
+
+
+
+
+
+
);
}
diff --git a/src/components/Navbar/Navbar.js b/src/components/Navbar/Navbar.js
index 7797d36..ddacbe9 100644
--- a/src/components/Navbar/Navbar.js
+++ b/src/components/Navbar/Navbar.js
@@ -2,6 +2,8 @@ import React from "react";
import { Link } from "react-router-dom";
import styled from "@emotion/styled";
+import { todayUrl, yearUrl, urls } from "../../utils/date";
+
import SignOut from "../SignOut";
import { withAuthentication } from "../session";
@@ -37,6 +39,8 @@ const Navbar = ({ authUser }) => (
{authUser ? (
+ Year
+ Today
Account
diff --git a/src/components/Seek/Seek.js b/src/components/Seek/Seek.js
new file mode 100644
index 0000000..6409171
--- /dev/null
+++ b/src/components/Seek/Seek.js
@@ -0,0 +1,29 @@
+import React from "react";
+import styled from "@emotion/styled";
+
+import { SIZES } from "../../styles/constants";
+
+const SeekHeader = styled.header`
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ align-items: center;
+ margin-top: ${SIZES.normal};
+`;
+const SeekH1 = styled.h1`
+ display: block;
+ font-size: ${SIZES.normal};
+`;
+const SeekArrows = styled.div``;
+
+const Seek = ({ title = "", prev = "", next = "" }) => (
+
+
+ {title}
+ asdf
+
+
+
+);
+
+export default Seek;
diff --git a/src/components/Seek/index.js b/src/components/Seek/index.js
new file mode 100644
index 0000000..d7a6634
--- /dev/null
+++ b/src/components/Seek/index.js
@@ -0,0 +1,2 @@
+import Seek from "./Seek";
+export default Seek;
diff --git a/src/components/firebase/fire.js b/src/components/firebase/fire.js
index 5dd81d7..c527b59 100644
--- a/src/components/firebase/fire.js
+++ b/src/components/firebase/fire.js
@@ -27,7 +27,10 @@ class Firebase {
doSignInWithEmailAndPassword = (email, password) =>
this.auth.signInWithEmailAndPassword(email, password);
- doSignOut = () => this.auth.signOut();
+ doSignOut = () => {
+ this.auth.signOut();
+ window.location.replace("/login");
+ };
doPasswordReset = email => this.auth.sendPasswordResetEmail(email);
diff --git a/src/components/screens/Year/Year.js b/src/components/screens/Year/Year.js
index bb0c606..d05da64 100644
--- a/src/components/screens/Year/Year.js
+++ b/src/components/screens/Year/Year.js
@@ -1,5 +1,26 @@
-import React from "react";
+import React, { Component } from "react";
+import isToday from "date-fns/is_today";
-const Year = () => Year
;
+import Seek from "../../Seek";
+
+class Year extends Component {
+ render() {
+ const {
+ match: {
+ params: { year }
+ }
+ } = this.props;
+ return (
+
+
+
+ );
+ }
+}
export default Year;
diff --git a/src/styles/constants.js b/src/styles/constants.js
new file mode 100644
index 0000000..4c80bf3
--- /dev/null
+++ b/src/styles/constants.js
@@ -0,0 +1,7 @@
+export const SIZES = {
+ tiny: "0.5rem",
+ small: "1rem",
+ normal: "1.25rem",
+ medium: "1.5rem",
+ large: "2rem"
+};
diff --git a/src/utils/date.js b/src/utils/date.js
new file mode 100644
index 0000000..8bb1718
--- /dev/null
+++ b/src/utils/date.js
@@ -0,0 +1,14 @@
+import format from "date-fns/format";
+
+export const pad = n => (n < 10 ? "0" : "") + n;
+
+export const todayUrl = (date = new Date()) =>
+ `/${date.getFullYear()}/${pad(date.getMonth() + 1)}/${pad(date.getDate())}/`;
+
+export const yearUrl = (date = new Date()) => `/${date.getFullYear()}/`;
+
+export const months = {
+ short: Array.from({ length: 12 }, (x, index) =>
+ new Date(0, index).toLocaleDateString("en-US", { month: "short" })
+ )
+};
diff --git a/yarn.lock b/yarn.lock
index 49d0f46..c099c72 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3203,6 +3203,11 @@ data-urls@^1.0.0:
whatwg-mimetype "^2.2.0"
whatwg-url "^7.0.0"
+date-fns@^1.30.1:
+ version "1.30.1"
+ resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-1.30.1.tgz#2e71bf0b119153dbb4cc4e88d9ea5acfb50dc05c"
+ integrity sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==
+
date-now@^0.1.4:
version "0.1.4"
resolved "https://registry.yarnpkg.com/date-now/-/date-now-0.1.4.tgz#eaf439fd4d4848ad74e5cc7dbef200672b9e345b"