37 lines
825 B
Svelte
37 lines
825 B
Svelte
<script lang="ts">
|
|
import Icon from "@iconify/svelte";
|
|
import { user } from "$lib/config";
|
|
import {
|
|
colorTheme,
|
|
getThemeIcon,
|
|
type ColorTheme,
|
|
} from "$lib/stores/theme";
|
|
import "$lib/assets/css/tui-header.css";
|
|
|
|
interface Props {
|
|
title?: string;
|
|
interactive?: boolean;
|
|
hasButtons?: boolean;
|
|
}
|
|
|
|
let {
|
|
title = "terminal",
|
|
interactive = true,
|
|
hasButtons = false,
|
|
}: Props = $props();
|
|
</script>
|
|
|
|
<div class="tui-statusbar top">
|
|
<span class="status-left">
|
|
<Icon icon={getThemeIcon($colorTheme)} width="14" />
|
|
<span class="user-host">{user.username}@{user.hostname}</span>
|
|
</span>
|
|
<span class="status-center">{title}</span>
|
|
<span class="status-right">
|
|
{#if interactive && hasButtons}
|
|
<span class="hint">↑↓ navigate</span>
|
|
<span class="hint">⏎ select</span>
|
|
{/if}
|
|
</span>
|
|
</div>
|