Improve the UI

1 files changed, 32 insertions, 10 deletions

diff --git a/src/main.tsx b/src/main.tsx
index f638946..cf9a20c 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1,22 +1,44 @@
-import { StrictMode } from 'react'
 import { createRoot } from 'react-dom/client'
-import { createBrowserRouter, RouterProvider } from 'react-router-dom'
-import { Home } from './pages/Home.tsx'
-import { Stop } from './pages/Stop.tsx'
+import { createBrowserRouter, Navigate, RouterProvider } from 'react-router'
+import { StopList } from './pages/StopList.tsx'
+import { Estimates } from './pages/Estimates.tsx'
+import { StopMap } from './pages/Map.tsx'
+import { Layout } from './Layout.tsx'
+import './styles/Pages.css'
 
 const router = createBrowserRouter([
   {
     path: '/',
-    element: <Home />,
+    element: <Layout><Navigate to="/stops" /></Layout>,
   },
   {
-    path: '/:stopId',
-    element: <Stop />
+    path: '/stops',
+    element: <Layout><StopList /></Layout>,
+  },
+  {
+    path: '/map',
+    element: <Layout><StopMap /></Layout>,
+  },
+  {
+    path: '/estimates/:stopId',
+    element: <Layout><Estimates /></Layout>
+  },
+  {
+    path: '/about',
+    element: <Layout><About /></Layout>
   }
 ])
 
+function About() {
+  return (
+    <div className="page-container about-page">
+      <h1 className="page-title">About InfoBus App</h1>
+      <p className="about-description">This application helps you find bus stops and check bus arrival estimates.</p>
+      <p className="about-version">Version 1.0.0</p>
+    </div>
+  )
+}
+
 createRoot(document.getElementById('root')!).render(
-  <StrictMode>
-    <RouterProvider router={router} />
-  </StrictMode>,
+  <RouterProvider router={router} />,
 )