Removed Tailwind css, moved api to v1 dir

components/charts/ethicsBar.tsx

@@ -8,8 +8,8 @@ import { number } from "prop-types";
 const fetcher = async (url:any) => await fetch(url).then((res) => res.json());
 
 export const EthicsBar = () => {
-  const {data: tmpData} = useSWR('/api/ethics',fetcher);
-  const {data: empData} = useSWR('/api/empires',fetcher);
+  const {data: tmpData} = useSWR('/api/v1/ethics',fetcher);
+  const {data: empData} = useSWR('/api/v1/empires',fetcher);
 
   const parseData = (data: Array<Array<any>>) => {
     let parsedData: EthicsDataG15[] = new Array<EthicsDataG15>;
@@ -115,8 +115,8 @@ export const EthicsBar = () => {
   ChartJS.register( ...registerables )
 
   return (
-    <div className="chart-container h-1/2 aspect-square p-2">
-      <Bar {...config} />
+    <div className='chart-container'>
+      <Bar className='chart' {...config} />
     </div>
   );
 }

components/charts/pops.tsx

@@ -8,7 +8,7 @@ import { Species } from '../../types/stellaris';
 const fetcher = async (url:any) => await fetch(url).then((res) => res.json());
 
 export const PopChart = () => {
-  const {data: tmpData} = useSWR('/api/species',fetcher);
+  const {data: tmpData} = useSWR('/api/v1/species',fetcher);
 
   let data;
   if (tmpData) {
@@ -90,8 +90,8 @@ export const PopChart = () => {
   ChartJS.register( ...registerables, ChartDataLabels )
 
   return (
-    <div className="chart-container h-1/2 aspect-square p-2">
-      <Pie {...config} />
+    <div className='chart-container'>
+      <Pie className='chart' {...config} />
     </div>
   );
 }

components/charts/radar.tsx

@@ -1,4 +1,5 @@
 'use client';
+import '@/app/globals.css';
 import { Ethics, EthicsDataG15, Scale } from '../../types/stellaris';
 import { Radar } from 'react-chartjs-2'
 import { Chart as ChartJS, registerables } from 'chart.js';
@@ -7,7 +8,7 @@ import useSWR from 'swr';
 const fetcher = async (url:any) => await fetch(url).then((res) => res.json());
 
 export const RadarChart = (props: { weighted: boolean }) => {
-  const {data: tmpData} = useSWR('/api/ethics',fetcher);
+  const {data: tmpData} = useSWR('/api/v1/ethics',fetcher);
   
   const parseData = (data: Array<Array<any>>) => {
     let parsedData: EthicsDataG15[] = new Array<EthicsDataG15>;
@@ -124,8 +125,8 @@ export const RadarChart = (props: { weighted: boolean }) => {
   ChartJS.register( ...registerables )
 
   return (
-    <div className="chart-container h-full aspect-square p-2">
-      <Radar {...config} />
+    <div className='chart-container'>
+      <Radar className=' chart' {...config} />
     </div>
   );
 };

components/navbar.tsx

@@ -0,0 +1,21 @@
+'use client';
+import '@/app/globals.css'
+import { usePathname } from 'next/navigation'
+import Links from '@/public/routes.json'; // move to api again but use this for inital hydration
+import Link from 'next/link';
+
+export const PageNavbar = () => {
+  const path = usePathname();
+
+  let navbar: JSX.Element 
+    navbar = (
+      <nav className='navbar'>
+        {Links.links.map((item) => (
+          <Link className={(path === item.href ? "active" : "")} key={item.name} href={item.href}>
+            {item.name}
+          </Link>
+        ))}
+      </nav>
+    );
+  return navbar;
+}

components/tables/empires.tsx

@@ -5,13 +5,13 @@ import useSWR from "swr";
 const fetcher = async (url:any) => await fetch(url).then((res) => res.json());
 
 export const EmpireStats = () => {
-  const {data} = useSWR('/api/empires',fetcher);
+  const {data} = useSWR('/api/v1/empires',fetcher);
   
   let ret;
 
   if (data) {
     ret = (
-      <div className="text-blue-600">{data.empireCount} Empires</div>
+      <div className="active">{data.empireCount} Empires</div>
     )
   }
   else {