57 lines
1.4 KiB
Svelte
57 lines
1.4 KiB
Svelte
<script>
|
|
import '$lib/css/base.css';
|
|
import '$lib/css/profile/base.css';
|
|
|
|
import { goto } from '$app/navigation';
|
|
import { page } from '$app/stores';
|
|
|
|
import { BiMap } from '$lib/js/bimap.js';
|
|
import ButtonSlider from '$lib/components/button-slider.svelte';
|
|
import Count from '$lib/components/count.svelte';
|
|
|
|
let cover =
|
|
'https://share.etheryo.fr/rando/2023.11.01/Groupe%20Ombre%20Lac%20Montagne%20Vert%20Bleu.jpg';
|
|
let profile = 'https://cloud.etheryo.fr/s/JrKoP57R4qHcR4A/download/pfp.jpg';
|
|
let name = 'Yohan Boujon';
|
|
let pronoun = 'il/lui';
|
|
|
|
const idUrl = new BiMap([
|
|
{ id: 0, str: 'bio' },
|
|
{ id: 1, str: 'articles' }
|
|
]);
|
|
const url = $page.route.id.split('/')[2];
|
|
|
|
function changeDir(click) {
|
|
const id = click.detail.id;
|
|
goto(idUrl.getStr(id), { noScroll: true });
|
|
}
|
|
let innerWidth;
|
|
</script>
|
|
|
|
<svelte:window bind:innerWidth />
|
|
|
|
<div class="profile">
|
|
<div class="profile-banner">
|
|
<div class="profile-banner-gradient" />
|
|
<div class="profile-banner-img"><img alt="banner" src={cover} /></div>
|
|
<div class="profile-banner-profile">
|
|
<img alt="profile" src={profile} />
|
|
</div>
|
|
</div>
|
|
<div class="profile-name center">
|
|
<h1>{name}</h1>
|
|
<span>{pronoun}</span>
|
|
<div style="margin-left: 2rem;">
|
|
<Count />
|
|
</div>
|
|
</div>
|
|
<div class="profile-main profile-slider center">
|
|
<ButtonSlider
|
|
width="20rem"
|
|
keys={['Biographie', 'Articles']}
|
|
on:click={changeDir}
|
|
active={idUrl.getInt(url)}
|
|
/>
|
|
</div>
|
|
<slot />
|
|
</div>
|