SirBlob/website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Group Header Rendering Fixes

Browse Source
This commit is contained in:
SirBlob
2025-11-29 22:14:25 +00:00
parent 0bb3de2b35
commit 49dea88868
7 changed files with 32 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/NavbarWaybar.svelte
+3 -10
View File
@@ -1,5 +1,5 @@
<script lang="ts">
import { mode, colorTheme, toggleMode, setColorTheme, themeOptions, themeColors, type ColorTheme } from '$lib/stores/theme';
import { mode, getThemeIcon, colorTheme, toggleMode, setColorTheme, themeOptions, themeColors, type ColorTheme } from '$lib/stores/theme';
import { page } from '$app/stores';
import { fly, fade, slide } from 'svelte/transition';
import { user, navigation } from '$lib/config';
@@ -166,13 +166,6 @@
mobileMenuOpen = false;
}
function getThemeIcon(theme: ColorTheme): string {
switch (theme) {
case 'arch': return 'mdi:arch';
case 'catppuccin': return 'solar:cat-bold';
default: return 'mdi:palette';
}
}
</script>
<svelte:window on:keydown={handleKeydown} />
@@ -195,9 +188,9 @@
<!-- Left modules -->
<div class="bar-left">
<!-- Arch logo / Launcher -->
<a href="/" class="module launcher" title="Home">
<!-- <a href="/" class="module launcher" title="Home">
<img src="/favicon.png" alt="Blob Icon" width="16" />
</a>
</a> -->
<!-- Mobile menu toggle -->
<button
src/lib/components/tui/TuiHeader.svelte
+1 -8
View File
@@ -1,20 +1,13 @@
<script lang="ts">
import Icon from '@iconify/svelte';
import { user } from '$lib/config';
import { colorTheme, type ColorTheme } from '$lib/stores/theme';
import { colorTheme, getThemeIcon, type ColorTheme } from '$lib/stores/theme';
import '$lib/assets/css/tui-header.css';
export let title = 'terminal';
export let interactive = true;
export let hasButtons = false;
function getThemeIcon(theme: ColorTheme): string {
switch (theme) {
case 'arch': return 'mdi:arch';
case 'catppuccin': return 'solar:cat-bold';
default: return 'mdi:palette';
}
}
</script>
<div class="tui-statusbar top">
src/lib/components/tui/TuiLine.svelte
+8 -3
View File
@@ -110,7 +110,12 @@
{#if line.content}<span class="image-caption">{line.content}</span>{/if}
</div>
{:else if !isImage}
{#if inline}
{#if inline && isHeader}
<span class="header-text inline-header">
<Icon icon="mdi:pound" width="20" class="header-icon" />
{#each segments as seg}{#if seg.icon}<Icon icon={seg.icon} width="20" class="inline-icon" />{:else if getSegmentStyle(seg)}<span style={getSegmentStyle(seg)}>{seg.text}</span>{:else}{seg.text}{/if}{/each}
</span>
{:else if inline}
<span class="inline-content {line.type}">
{getLinePrefix(line.type)}{#each segments as seg}{#if seg.icon}<Icon icon={seg.icon} width="14" class="inline-icon" />{:else if getSegmentStyle(seg)}<span style={getSegmentStyle(seg)}>{seg.text}</span>{:else}{seg.text}{/if}{/each}
</span>
@@ -124,8 +129,8 @@
{/if}
{#if isHeader}
<span class="content header-text">
<Icon icon="mdi:pound" width="14" class="header-icon" />
{#each segments as seg}{#if seg.icon}<Icon icon={seg.icon} width="16" class="inline-icon" />{:else if getSegmentStyle(seg)}<span style={getSegmentStyle(seg)}>{seg.text}</span>{:else}{seg.text}{/if}{/each}
<Icon icon="mdi:pound" width="25" class="header-icon" />
{#each segments as seg}{#if seg.icon}<Icon icon={seg.icon} width="25" class="inline-icon" />{:else if getSegmentStyle(seg)}<span style={getSegmentStyle(seg)}>{seg.text}</span>{:else}{seg.text}{/if}{/each}
</span>
{:else}
<span class="content">