diff --git a/frontend/src/lib/components/Header.svelte b/frontend/src/lib/components/Header.svelte
index 07ecfe6..1ac25e6 100644
--- a/frontend/src/lib/components/Header.svelte
+++ b/frontend/src/lib/components/Header.svelte
@@ -1,43 +1,57 @@
-
-
-
-
-
-
-
-
-
Percorsi {title}
-
-
+
+{#if transparent}
+
+
+
+
+
+
+
+
+
+
+{:else}
+
+
+
+
+
+
+
+
Percorsi {title}
+
+
+{/if}
\ No newline at end of file
+ img {
+ height: 40px;
+ }
+ .back {
+ height: 20px;
+ }
+
diff --git a/frontend/src/lib/components/InfoTab.svelte b/frontend/src/lib/components/InfoTab.svelte
new file mode 100644
index 0000000..94a59a4
--- /dev/null
+++ b/frontend/src/lib/components/InfoTab.svelte
@@ -0,0 +1,76 @@
+
+
+
+
+
+
+
Dislivello Positivo
+
Value
+
+
+
+
Velocità Media
+
Value
+
+
+
+
+
+
Dislivello Negativo
+
Value
+
+
+
+
+
+
Altitudine max
+
Value
+
+
+
+
Altitudine min
+
Value
+
+
+
+
Tipo Percorso
+
Value
+
+
+
+
diff --git a/frontend/src/lib/components/Tabs.svelte b/frontend/src/lib/components/Tabs.svelte
new file mode 100644
index 0000000..d1135c3
--- /dev/null
+++ b/frontend/src/lib/components/Tabs.svelte
@@ -0,0 +1,57 @@
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/frontend/src/routes/routes/[slug]/+page.server.ts b/frontend/src/routes/routes/[slug]/+page.server.ts
new file mode 100644
index 0000000..dcea290
--- /dev/null
+++ b/frontend/src/routes/routes/[slug]/+page.server.ts
@@ -0,0 +1,12 @@
+import { error } from "@sveltejs/kit";
+
+export const prerender = false;
+
+export async function load({ params }) {
+ return {
+ id: 1,
+ name: 'Pianello 1',
+ image: '/images/test-1.jpg',
+ duration: 1233
+ };
+}
diff --git a/frontend/src/routes/routes/[slug]/+page.svelte b/frontend/src/routes/routes/[slug]/+page.svelte
new file mode 100644
index 0000000..db3d693
--- /dev/null
+++ b/frontend/src/routes/routes/[slug]/+page.svelte
@@ -0,0 +1,45 @@
+
+
+
+
+
+
+
+
Percorso {data.name}
+
Durata {Math.floor(Number(data.duration) / 60)}'
+
+
+
+
+
+
\ No newline at end of file