diff --git a/src/components/navigation/menuItems.ts b/src/components/navigation/menuItems.ts
index d6d2b60..564043f 100644
--- a/src/components/navigation/menuItems.ts
+++ b/src/components/navigation/menuItems.ts
@@ -1 +1 @@
-export const menuItems = [{ link: "/pdfs", label: "PDFs" }];
+export const menuItems = [{ link: "/tideTables", label: "Tide Tables" }];
diff --git a/src/components/templates/TideTablePage.tsx b/src/components/templates/TideTablePage.tsx
index f8bc0a5..f1d2e78 100644
--- a/src/components/templates/TideTablePage.tsx
+++ b/src/components/templates/TideTablePage.tsx
@@ -1,25 +1,34 @@
 import * as React from "react"
 import type { HeadFC, PageProps } from "gatsby"
-import { Center, Container, Image, Text } from "@mantine/core"
+import { Card, Center, Container, Group, Image, Text } from "@mantine/core"
 import TidalData from "../../../data/tides.json";
-//import Layout from "../../components/navigation/Layout"
 import { SEO } from "../../components/SEO";
 import Layout from "../navigation/Layout";
+import { DateTime } from "luxon";
+import { TidesJson_PDFObject, TidesJson_ScheduleObject } from "../../types";
 
 
-const Page: React.FC<PageProps> = ({ pageContext }: { pageContext: any }) => {
-  const today = new Date();
-  today.setHours(0, 0, 0, 0);
-  const nextWeek = new Date(today);
-  nextWeek.setDate(today.getDate() + 7);
-  const tides = TidalData.schedule.filter(element => {
-    let date = new Date(element.date);
-    return date >= today && date <= nextWeek
+const Page: React.FC<PageProps> = ({ pageContext }: { pageContext: { pdf: TidesJson_PDFObject } }) => {
+  const firstDayOfMonth = pageContext.pdf.date;
+  const monthMatch = firstDayOfMonth.split("-")[0] + firstDayOfMonth.split("-")[1];
+  const tides = TidalData.schedule.filter((element: TidesJson_ScheduleObject) => {
+    return element.date.startsWith(monthMatch)
   });
-  console.log(pageContext)
+  console.log(tides)
   return (
     <Layout>
-      Test page
+      {tides.map((element: TidesJson_ScheduleObject, index: React.Key) => (
+        <Card shadow="xs" key={index}>
+
+          <Text size="xl" fw={500}>{DateTime.fromSQL(element.date).toLocaleString({ weekday: "long", day: "2-digit", month: "long" })}</Text>
+          {element.groups.map(tide => (
+            <Group justify="start" mt="md" mb="xs">
+              <Text size="lg" fw={500} >{DateTime.fromSQL(element.date + " " + tide.time).toLocaleString(DateTime.TIME_SIMPLE)}</Text>
+              <Text size="lg" fw={200}>{tide.height}m</Text>
+            </Group>
+          ))}
+        </Card>
+      ))}
     </Layout>
   )
 }
diff --git a/src/pages/pdfs.tsx b/src/pages/pdfs.tsx
deleted file mode 100644
index ef71f51..0000000
--- a/src/pages/pdfs.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import * as React from "react"
-import type { HeadFC, PageProps } from "gatsby"
-import { Center, Container, Image, Text } from "@mantine/core"
-import Layout from "../components/navigation/Layout"
-import { SEO } from "../components/SEO";
-import TidalData from "../../data/tides.json";
-import { Link } from "gatsby";
-
-
-const Page: React.FC<PageProps> = () => {
-  const month = new Date();
-  month.setHours(0, 0, 0, 0);
-  month.setDate(1);
-  const nextYear = new Date(month);
-  nextYear.setFullYear(month.getFullYear() + 1);
-  const files = TidalData.pdfs.filter((element: { date: string | number | Date; }) => {
-    let date = new Date(element.date);
-    return date < nextYear;
-  });
-  return (
-    <Layout>
-        <Center>
-          {files.map((element, index) => (<a href={"/tide-tables/" + element.filename} key={index}>{element.name}</a>))}
-        </Center>
-    </Layout>
-  )
-}
-
-export default Page
-
-export const Head: HeadFC = () => (
-  <SEO />
-)
\ No newline at end of file
diff --git a/src/pages/tideTables.tsx b/src/pages/tideTables.tsx
index 0f92b39..a4299e3 100644
--- a/src/pages/tideTables.tsx
+++ b/src/pages/tideTables.tsx
@@ -14,14 +14,14 @@ const Page: React.FC<PageProps> = () => {
   month.setDate(1);
   const nextYear = new Date(month);
   nextYear.setFullYear(month.getFullYear() + 1);
-  const files = TidalData.pdfs.filter((element: { date: string | number | Date; }) => {
+  const files = TidalData.pdfs.filter((element: TidesJson_PDFObject) => {
     let date = new Date(element.date);
     return date < nextYear;
   });
   return (
     <Layout>
       <Center>
-        {files.map((element: TidesJson_PDFObject, index: React.Key) => (<a href={"/tide-tables/" + element.filename.replace(".pdf", "")} key={index}>{element.name}</a>))}
+        {files.map((element: TidesJson_PDFObject, index: React.Key) => (<a href={"/tide-tables/" + element.url + "/"} key={index}>{element.name}</a>))}
       </Center>
     </Layout>
   )