pianello/pianello-web-app
pianello/pianello-web-app
2
0
Fork 0
Code Issues 3 Pull requests Projects 1 Releases Packages Wiki Activity

Add route.cover
Some checks failed
ci/woodpecker/push/build Pipeline failed
Details

Browse source
This commit is contained in:
Alessio Davoli 2023-12-22 15:32:39 +01:00
parent a3868ac971
commit b7a5609e91
1 changed files with 9 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
frontend/src/lib/components/Route.svelte
View file

@ -1,11 +1,12 @@
<script lang="ts"> <script lang="ts">
import {PUBLIC_BACKEND_URL} from '$env/static/public'
export let route: App.Route; export let route: App.Route;
</script> </script>
<a href="/routes/{route.id}"> <a href="/routes/{route.id}">
<div id="image" style="background-image: url(/images/test-1.jpg" /> <div id="image" style:background-image="url({route.cover})" />
<div id='path-holder'> <div id='path-holder'>
<div style='font-size: 20px;'>Percorso</div>
<p class='path-name'>{route.title_it}</p> <p class='path-name'>{route.title_it}</p>
</div> </div>
<div id='duration-holder'> <div id='duration-holder'>
@ -21,7 +22,7 @@
display: block; display: block;
box-shadow: 0 0 50px #ccc; box-shadow: 0 0 50px #ccc;
border-radius: 5px; border-radius: 5px;
width: calc((100% - 50px) / 2); width: calc((100% - 50px));
font-size: 18px; font-size: 18px;
} }
@ -59,10 +60,14 @@
padding-top: 2px; padding-top: 2px;
padding-bottom: 2px; padding-bottom: 2px;
font-weight: bold; font-weight: bold;
font-size: 22px; font-size: 1em;
line-height: 1em;
text-overflow: ellipsis;
overflow: hidden;
} }
.path-name { .path-name {
view-transition-name: title; view-transition-name: title;
max-height: 2em;
} }
</style> </style>