Extract the HelpButton as a dedicated component
This commit is contained in:
parent
b8c9252f46
commit
53ee9e0cc5
|
@ -15,6 +15,7 @@
|
||||||
} from 'sveltestrap';
|
} from 'sveltestrap';
|
||||||
|
|
||||||
import { logout as APILogout } from '$lib/api/user';
|
import { logout as APILogout } from '$lib/api/user';
|
||||||
|
import HelpButton from '$lib/components/Help.svelte';
|
||||||
import Logo from '$lib/components/Logo.svelte';
|
import Logo from '$lib/components/Logo.svelte';
|
||||||
import { userSession, refreshUserSession } from '$lib/stores/usersession';
|
import { userSession, refreshUserSession } from '$lib/stores/usersession';
|
||||||
import { toasts } from '$lib/stores/toasts';
|
import { toasts } from '$lib/stores/toasts';
|
||||||
|
@ -98,18 +99,11 @@
|
||||||
<Logo />
|
<Logo />
|
||||||
</NavbarBrand>
|
</NavbarBrand>
|
||||||
<Nav class="ms-auto" navbar>
|
<Nav class="ms-auto" navbar>
|
||||||
<Button
|
<HelpButton
|
||||||
href={helpLink}
|
href={helpLink}
|
||||||
target="_blank"
|
|
||||||
color="primary"
|
|
||||||
size={$userSession?"sm":undefined}
|
size={$userSession?"sm":undefined}
|
||||||
class={$userSession?"my-2":"me-2"}
|
class={$userSession?"my-2":"me-2"}
|
||||||
>
|
/>
|
||||||
<Icon
|
|
||||||
name="question-circle-fill"
|
|
||||||
title={$t('common.help')}
|
|
||||||
/>
|
|
||||||
</Button>
|
|
||||||
{#if $userSession}
|
{#if $userSession}
|
||||||
<Dropdown nav inNavbar>
|
<Dropdown nav inNavbar>
|
||||||
<DropdownToggle nav caret>
|
<DropdownToggle nav caret>
|
||||||
|
|
29
ui/src/lib/components/Help.svelte
Normal file
29
ui/src/lib/components/Help.svelte
Normal file
|
@ -0,0 +1,29 @@
|
||||||
|
<script lang="ts">
|
||||||
|
import { page } from '$app/stores'
|
||||||
|
|
||||||
|
import {
|
||||||
|
Button,
|
||||||
|
Icon,
|
||||||
|
} from 'sveltestrap';
|
||||||
|
|
||||||
|
import { t, locale } from '$lib/translations';
|
||||||
|
|
||||||
|
export { className as class };
|
||||||
|
let className = '';
|
||||||
|
export let color = "primary"
|
||||||
|
export let href: string;
|
||||||
|
export let size: string | null;
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<Button
|
||||||
|
{href}
|
||||||
|
target="_blank"
|
||||||
|
{color}
|
||||||
|
{size}
|
||||||
|
class={className}
|
||||||
|
>
|
||||||
|
<Icon
|
||||||
|
name="question-circle-fill"
|
||||||
|
title={$t('common.help')}
|
||||||
|
/>
|
||||||
|
</Button>
|
Loading…
Reference in New Issue
Block a user