diff --git a/crates/frontend/Cargo.toml b/crates/frontend/Cargo.toml
index d100300..69c974b 100644
--- a/crates/frontend/Cargo.toml
+++ b/crates/frontend/Cargo.toml
@@ -16,4 +16,4 @@ thiserror = { workspace = true }
 tokio = { workspace = true }
 actix-web = { workspace = true }
 rustical_store = { workspace = true }
-actix-files = "0.6.6"
+actix-files = "0.6"
diff --git a/crates/frontend/askama.toml b/crates/frontend/askama.toml
index 88a1a82..fd6b343 100644
--- a/crates/frontend/askama.toml
+++ b/crates/frontend/askama.toml
@@ -1,2 +1,2 @@
 [general]
-dirs = ["frontend/dist/src/templates"]
+dirs = ["frontend/dist/templates"]
diff --git a/crates/frontend/frontend/src/templates/layouts/default.html b/crates/frontend/frontend/src/templates/layouts/default.html
index cb7b336..c2b3e23 100644
--- a/crates/frontend/frontend/src/templates/layouts/default.html
+++ b/crates/frontend/frontend/src/templates/layouts/default.html
@@ -6,6 +6,11 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>{% block title %}RustiCal{% endblock %}</title>
   <script type="module" src="htmx.org"></script>
+  <style>
+    * {
+      box-sizing: border-box;
+    }
+  </style>
   {% block imports %}{% endblock %}
 </head>
 
diff --git a/crates/frontend/frontend/src/templates/pages/calendar.html b/crates/frontend/frontend/src/templates/pages/calendar.html
new file mode 100644
index 0000000..fedc8d8
--- /dev/null
+++ b/crates/frontend/frontend/src/templates/pages/calendar.html
@@ -0,0 +1,9 @@
+{% extends "layouts/default.html" %}
+
+{% block imports %}
+{% endblock %}
+
+{% block content %}
+<h1>Test</h1>
+<a href="/frontend/user/{{ calendar.principal }}">Back</a>
+{% endblock %}
diff --git a/crates/frontend/frontend/src/templates/pages/user.html b/crates/frontend/frontend/src/templates/pages/user.html
index 0717c89..e3bbd90 100644
--- a/crates/frontend/frontend/src/templates/pages/user.html
+++ b/crates/frontend/frontend/src/templates/pages/user.html
@@ -1,20 +1,21 @@
 {% extends "layouts/default.html" %}
 
 {% block imports %}
+{% endblock %}
+
+{% block content %}
 <style>
 li {
   list-style: none;
   display: block;
   margin: 12px;
-  height: 80px;
+  min-height: 80px;
   background: #EEE;
   padding: 8px;
+  border-radius: 12px;
 }
 </style>
-{% endblock %}
-
-{% block content %}
-<h2>Welcome {{ owner }}!</h2>
+<h2>Welcome {{ user_id }}!</h2>
 <ul>
   {% for calendar in calendars %}
   <li>
@@ -23,9 +24,12 @@ li {
     {% else %}
     {{ calendar.id }}
     {% endif %}
-    <p>
+    {% let color = calendar.color.to_owned().unwrap_or("red".to_owned()) %}
+    <p style="color: {{ color }}">
     {% if let Some(description) = calendar.description %}{{ description }}{% endif %}
     </p>
+    <!-- <a href="{{ calendar.id}}">Test</a> -->
+    <a href="/frontend/user/{{ user_id }}/{{ calendar.id}}">Test</a>
   </li>
   {% endfor %}
 </ul>
diff --git a/crates/frontend/frontend/vite.config.js b/crates/frontend/frontend/vite.config.js
index 089f025..3fe8f15 100644
--- a/crates/frontend/frontend/vite.config.js
+++ b/crates/frontend/frontend/vite.config.js
@@ -3,19 +3,9 @@ import { globSync } from 'glob'
 import path from 'node:path'
 import { fileURLToPath } from 'node:url'
 
-console.log(
-  Object.fromEntries(globSync('src/templates/**/*.html').map(file => [
-    path.relative(
-      'src',
-      file.slice(0, file.length - path.extname(file).length)
-    ),
-    // This expands the relative paths to absolute paths, so e.g.
-    // src/nested/foo becomes /project/src/nested/foo.js
-    fileURLToPath(new URL(file, import.meta.url))
-  ])),
-)
-
 export default defineConfig({
+  root: "src",
+  base: "/frontend",
   build: {
     modulePreload: {
       polyfill: false
diff --git a/crates/frontend/src/lib.rs b/crates/frontend/src/lib.rs
index 9094ee8..efd9e41 100644
--- a/crates/frontend/src/lib.rs
+++ b/crates/frontend/src/lib.rs
@@ -8,7 +8,7 @@ use actix_web::{
 use askama::Template;
 use routes::login::{route_get_login, route_post_login};
 use rustical_store::{
-    auth::{AuthenticationMiddleware, AuthenticationProvider},
+    auth::{AuthenticationMiddleware, AuthenticationProvider, User},
     model::Calendar,
     CalendarStore,
 };
@@ -23,19 +23,39 @@ pub use config::FrontendConfig;
 #[derive(Template)]
 #[template(path = "pages/user.html")]
 struct UserPage {
-    pub owner: String,
+    pub user_id: String,
     pub calendars: Vec<Calendar>,
 }
 
 async fn route_user<C: CalendarStore + ?Sized>(
     path: Path<String>,
     store: Data<RwLock<C>>,
+    user: User,
 ) -> impl Responder {
     let store = store.read().await;
-    let owner = path.into_inner();
+    let user_id = path.into_inner();
     UserPage {
+        calendars: store.get_calendars(&user.id).await.unwrap(),
+        user_id: user.id,
+    }
+}
+
+#[derive(Template)]
+#[template(path = "pages/calendar.html")]
+struct CalendarPage {
+    owner: String,
+    calendar: Calendar,
+}
+
+async fn route_calendar<C: CalendarStore + ?Sized>(
+    path: Path<(String, String)>,
+    store: Data<RwLock<C>>,
+) -> impl Responder {
+    let store = store.read().await;
+    let (owner, cid) = path.into_inner();
+    CalendarPage {
         owner: owner.to_owned(),
-        calendars: store.get_calendars(&owner).await.unwrap(),
+        calendar: store.get_calendar(&owner, &cid).await.unwrap(),
     }
 }
 
@@ -63,6 +83,10 @@ pub fn configure_frontend<AP: AuthenticationProvider, C: CalendarStore + ?Sized>
             .service(
                 web::resource("/user/{user}").route(web::method(Method::GET).to(route_user::<C>)),
             )
+            .service(
+                web::resource("/user/{user}/{calendar}")
+                    .route(web::method(Method::GET).to(route_calendar::<C>)),
+            )
             .service(
                 web::resource("/login")
                     .route(web::method(Method::GET).to(route_get_login))
diff --git a/crates/store/Cargo.toml b/crates/store/Cargo.toml
index 3575087..298b5f9 100644
--- a/crates/store/Cargo.toml
+++ b/crates/store/Cargo.toml
@@ -23,6 +23,7 @@ rstest_reuse = { workspace = true }
 thiserror = { workspace = true }
 password-auth = { workspace = true }
 actix-web = { workspace = true }
+actix-session = { workspace = true }
 actix-web-httpauth = { workspace = true }
 tracing = { workspace = true }
 pbkdf2 = { workspace = true }
diff --git a/crates/store/src/auth/middleware.rs b/crates/store/src/auth/middleware.rs
index 2a0a767..e47e189 100644
--- a/crates/store/src/auth/middleware.rs
+++ b/crates/store/src/auth/middleware.rs
@@ -1,8 +1,9 @@
-use super::AuthenticationProvider;
+use super::{AuthenticationProvider, User};
+use actix_session::Session;
 use actix_web::{
     dev::{forward_ready, Service, ServiceRequest, ServiceResponse, Transform},
     http::header::Header,
-    HttpMessage,
+    FromRequest, HttpMessage,
 };
 use actix_web_httpauth::headers::authorization::{Authorization, Basic};
 use std::{
@@ -77,6 +78,20 @@ where
                     }
                 }
             }
+
+            // Extract user from session cookie
+            if let Ok(session) = Session::extract(req.request()).await {
+                println!("There's a session!");
+                match session.get::<User>("user") {
+                    Ok(Some(user)) => {
+                        req.extensions_mut().insert(user);
+                    }
+                    Ok(None) => {}
+                    Err(err) => {
+                        dbg!(err);
+                    }
+                };
+            }
             service.call(req).await
         })
     }