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

Fix header css
All checks were successful
ci/woodpecker/push/build Pipeline was successful
Details

Browse source
This commit is contained in:
Alessio Davoli 2023-07-18 16:17:39 +02:00
parent 98ca582e97
commit 44e8bef5d0
3 changed files with 49 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

78
frontend/src/lib/components/Header.svelte
View file

@ -1,47 +1,47 @@
<script lang="ts"> <script lang="ts">
export let title: string = 'Naturalistici'; export let title: string = 'Naturalistici';
const goBack = () => { const goBack = () => {
history.back(); history.back();
}; };
</script> </script>
<div style=''> <div>
<!-- svelte-ignore a11y-no-static-element-interactions --> <!-- svelte-ignore a11y-no-static-element-interactions -->
<!-- svelte-ignore a11y-click-events-have-key-events --> <!-- svelte-ignore a11y-click-events-have-key-events -->
<!-- svelte-ignore a11y-missing-attribute --> <!-- svelte-ignore a11y-missing-attribute -->
<a on:click={goBack}> <a on:click={goBack}>
<img class="back" src="/images/black-back-arrow.png" alt="" /> <img class="back" src="/images/black-back-arrow.png" alt="" />
</a> </a>
<img src="/images/app-bar-logo.png" alt="" /> <img src="/images/app-bar-logo.png" alt="" />
</div> </div>
<style> <style>
div { div {
position: fixed; position: fixed;
padding: 15px; padding: 15px;
background-color: transparent; background-color: transparent;
color: black; color: black;
margin: 0 auto; margin: 0 auto;
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
div a { div a {
cursor: pointer; cursor: pointer;
} }
div a img { div a img {
height: 40px; height: 40px;
} }
img { img {
height: 40px; height: 40px;
} }
.back { .back {
height: 20px; height: 20px;
} }
</style> </style>

10
frontend/src/lib/components/HomeHeader.svelte
View file

@ -20,13 +20,19 @@
<style> <style>
div { div {
color: white; color: white;
padding: 5px; margin: 0 auto;
padding-left: 15px;
padding-right: 15px;
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-evenly; justify-content: space-between;
align-items: center; align-items: center;
background-color: #de0e1b; background-color: #de0e1b;
} }
div p {
margin: 0;
padding: 0;
}
div a { div a {
cursor: pointer; cursor: pointer;
} }

4
frontend/src/routes/paths/[slug]/+page.svelte
View file

@ -1,10 +1,10 @@
<script lang="ts"> <script lang="ts">
import Route from '$lib/components/Route.svelte'; import Route from '$lib/components/Route.svelte';
import Header from '$lib/components/Header.svelte'; import HomeHeader from '$lib/components/HomeHeader.svelte';
export let data; export let data;
</script> </script>
<Header title={data.title}></Header> <HomeHeader title={data.title}></HomeHeader>
<div> <div>
{#each data.routes as route} {#each data.routes as route}