Fix route slug

This commit is contained in:
Alessio Davoli 2023-11-27 05:30:25 +01:00
parent 33bbf50a2d
commit 0143a16042
2 changed files with 57 additions and 48 deletions

View file

@ -1,61 +1,63 @@
<script lang="ts">
import Header from '$lib/components/Header.svelte';
import Tabs from '$lib/components/Tabs.svelte';
import MapTab from '$lib/components/tabs/MapTab.svelte';
import Header from '$lib/components/Header.svelte';
import Tabs from '$lib/components/Tabs.svelte';
import { onMount } from 'svelte';
export let data;
let divider;
export let data: App.Route;
const mapClick = (evt) => {
}
let divider;
onMount(async () => {
console.log(data);
});
const mapClick = (evt) => {};
</script>
<Header></Header>
<img src='/images/splash-background.webp' alt='splash'>
<img src="/images/splash-background.webp" alt="splash" />
<div bind:this={divider} id='divider'>
<div id='banner'>
<p>Percorso <b>{data.name}</b></p>
<p id='duration'>Durata {Math.floor(Number(data.duration) / 60)}'</p>
</div>
<Tabs on:map-click={mapClick}></Tabs>
<div bind:this={divider} id="divider">
<div id="banner">
<p>Percorso <b>{data.name_it}</b></p>
<p id="duration">Dislivello {data.elevation_gain}</p>
</div>
<Tabs on:map-click={mapClick} route={data}></Tabs>
</div>
<style>
#divider {
background: white;
margin-top: 0px;
margin-top: 0;
transition: transform 400ms;
align-self: end;
}
#divider {
background: white;
margin-top: 0px;
margin-top: 0;
transition: transform 400ms;
align-self: end;
}
img {
width: 100%;
height: calc(100% - 10vh - 10px);
position: absolute;
z-index: -1;
}
img {
width: 100%;
height: calc(100% - 10vh - 10px);
position: absolute;
z-index: -1;
}
#banner {
display: flex;
padding: 5px;
background-color: #de0e1b;
color: white;
font-size: 1.3em;
justify-content: space-evenly;
align-items: center;
padding: 20px;
}
#banner p {
margin: 0;
padding: 0;
}
#banner {
display: flex;
padding: 5px;
background-color: #de0e1b;
color: white;
font-size: 1.3em;
justify-content: space-evenly;
align-items: center;
padding: 20px;
}
#banner p {
margin: 0;
padding: 0;
}
#banner #duration {
font-size: 14px;
text-align: rightìì;
}
#banner #duration {
font-size: 14px;
text-align: rightìì;
}
</style>

View file

@ -0,0 +1,7 @@
import { getRoute } from '$lib/repo.js';
import { error } from '@sveltejs/kit';
/** @type {import('./$types').PageLoad} */
export async function load({ params }) {
return await getRoute(params.slug);
}