Compare commits
2 Commits
022d727394
...
71aabfb9ba
Author | SHA1 | Date | |
---|---|---|---|
71aabfb9ba | |||
e7944b9aa0 |
@ -1,11 +1,12 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { onMount } from "svelte";
|
import { onMount } from "svelte";
|
||||||
export let username;
|
export let user;
|
||||||
|
|
||||||
function toggle_options(){
|
function toggle_options(){
|
||||||
const el = document.querySelector("#options")
|
const el = document.querySelector("#options")
|
||||||
el.hidden = !el.hidden
|
el.hidden = !el.hidden
|
||||||
}
|
}
|
||||||
let src="https://bocken.org/static/user/thumb/" + username + ".webp"
|
|
||||||
onMount( () => {
|
onMount( () => {
|
||||||
document.addEventListener("click", (e) => {
|
document.addEventListener("click", (e) => {
|
||||||
const el = document.querySelector("#button")
|
const el = document.querySelector("#button")
|
||||||
@ -101,6 +102,12 @@
|
|||||||
/* (B2) BOTTOM "CALLOUT TAIL" */
|
/* (B2) BOTTOM "CALLOUT TAIL" */
|
||||||
h2{
|
h2{
|
||||||
margin-block: 0;
|
margin-block: 0;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
h2 + p{
|
||||||
|
padding-top: 0;
|
||||||
|
margin-top: 0;
|
||||||
|
font-size: 1.2rem;
|
||||||
}
|
}
|
||||||
@media screen and (max-width: 800px){
|
@media screen and (max-width: 800px){
|
||||||
#options{
|
#options{
|
||||||
@ -125,10 +132,11 @@ h2{
|
|||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
{#if username}
|
{#if user}
|
||||||
<button on:click={toggle_options} style="background-image: url({src})" id=button>
|
<button on:click={toggle_options} style="background-image: url(https://bocken.org/static/user/thumb/{user.nickname}.webp)" id=button>
|
||||||
<div id=options class="speech top" hidden>
|
<div id=options class="speech top" hidden>
|
||||||
<h2>{username}</h2>
|
<h2>{user.name}</h2>
|
||||||
|
<p>({user.nickname})</p>
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="https://sso.bocken.org/if/user/#/settings" >Einstellungen</a></li>
|
<li><a href="https://sso.bocken.org/if/user/#/settings" >Einstellungen</a></li>
|
||||||
<li><a href="/auth/signout" >Log Out</a></li>
|
<li><a href="/auth/signout" >Log Out</a></li>
|
||||||
|
@ -2,23 +2,15 @@
|
|||||||
import Header from '$lib/components/Header.svelte'
|
import Header from '$lib/components/Header.svelte'
|
||||||
import UserHeader from '$lib/components/UserHeader.svelte';
|
import UserHeader from '$lib/components/UserHeader.svelte';
|
||||||
export let data
|
export let data
|
||||||
let username = ""
|
let user;
|
||||||
if(data.session){
|
if(data.session){
|
||||||
username = data.session.user.name
|
user = data.session.user
|
||||||
}
|
}
|
||||||
console.log(data)
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Header>
|
<Header>
|
||||||
<ul class=site_header slot=links>
|
<ul class=site_header slot=links>
|
||||||
<li><a href="/rezepte">Rezepte</a></li>
|
|
||||||
<li><a href="/git">Git</a></li>
|
|
||||||
<li><a href="https://stream.bocken.org">Streaming</a></li>
|
|
||||||
<li><a href="/bilder">Bilder</a></li>
|
|
||||||
<li><a href="https://meet.bocken.org">Jitsi</a></li>
|
|
||||||
<li><a href="https://cloud.bocken.org">Cloud</a></li>
|
|
||||||
<li><a href="/searx">Searx</a></li>
|
|
||||||
</ul>
|
</ul>
|
||||||
<UserHeader {username} slot=right_side></UserHeader>
|
<UserHeader {user} slot=right_side></UserHeader>
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</Header>
|
</Header>
|
||||||
|
@ -53,6 +53,14 @@ section h2{
|
|||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
<svelte:head>
|
||||||
|
<title>Bocken</title>
|
||||||
|
<meta name="description" content="Die persönliche Website von Alexander Bocken" />
|
||||||
|
<meta property="og:image" content="https://bocken.org/static/favicon.png" />
|
||||||
|
<meta property="og:image:secure_url" content="https://bocken.org/favicon.png" />
|
||||||
|
<meta property="og:image:type" content="image/png" />
|
||||||
|
<meta property="og:image:alt" content="Das Familienwappen simplifiziert" />
|
||||||
|
</svelte:head>
|
||||||
{#if ! data.session}
|
{#if ! data.session}
|
||||||
|
|
||||||
<section class=hero>
|
<section class=hero>
|
||||||
@ -74,6 +82,7 @@ section h2{
|
|||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
|
|
||||||
<h2>Seiten</h2>
|
<h2>Seiten</h2>
|
||||||
<LinksGrid>
|
<LinksGrid>
|
||||||
<a href="rezepte">
|
<a href="rezepte">
|
||||||
|
@ -1,8 +1,8 @@
|
|||||||
import type { Actions, PageServerLoad } from "./$types"
|
import type { PageServerLoad } from "./$types"
|
||||||
import { error } from "@sveltejs/kit"
|
import { error } from "@sveltejs/kit"
|
||||||
|
|
||||||
export const load = (async ({cookies, locals}) => {
|
export const load : PageServerLoad = async ({locals}) => {
|
||||||
return {
|
return {
|
||||||
session: await locals.getSession()
|
session: await locals.auth()
|
||||||
}
|
}
|
||||||
});
|
};
|
||||||
|
@ -2,9 +2,9 @@
|
|||||||
import Header from '$lib/components/Header.svelte'
|
import Header from '$lib/components/Header.svelte'
|
||||||
import UserHeader from '$lib/components/UserHeader.svelte';
|
import UserHeader from '$lib/components/UserHeader.svelte';
|
||||||
export let data
|
export let data
|
||||||
let username = ""
|
let user;
|
||||||
if(data.session){
|
if(data.session){
|
||||||
username = data.session.user.name
|
user = data.session.user
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -16,6 +16,6 @@ if(data.session){
|
|||||||
<li><a href="/rezepte/icon">Icon</a></li>
|
<li><a href="/rezepte/icon">Icon</a></li>
|
||||||
<li><a href="/rezepte/tag">Stichwörter</a></li>
|
<li><a href="/rezepte/tag">Stichwörter</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<UserHeader slot=right_side {username}></UserHeader>
|
<UserHeader slot=right_side {user}></UserHeader>
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</Header>
|
</Header>
|
||||||
|
Loading…
Reference in New Issue
Block a user