kibi/mumh5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Stacked layout: the chat keeps about five lines under a stream

Browse Source 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
kibi
2026-10-01 22:31:35 +02:00
co-authored by Claude Opus 5.5
parent 68f68d1d76
commit 5cc379417b
3 changed files with 16 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/ui/Chat.svelte
+3 -1
View File
@@ -18,7 +18,7 @@
});
</script>
<section class="chat" aria-label="Chat">
<section class="chat" class:video-only={videoOnly} aria-label="Chat">
<header>
{#if showMenu}<button class="icon-btn" onclick={onmenu} aria-label="Open channels"><Icon name="menu" /></button>{/if}
<Icon name={isDm ? 'message' : 'hash'} size={20} />
@@ -74,6 +74,8 @@
</section>
<style>
/* Stacked layout: room for about five lines of chat whatever the stream above takes */
.chat.video-only :global(.wrap[role=log]) { min-height: 124px; flex-shrink: 0; }
.chat { position: relative; flex: 1; min-width: 0; display: flex; flex-direction: column; background: var(--bg-2); }
header { height: 52px; flex: none; display: flex; align-items: center; gap: 8px; padding: 0 8px 0 16px; border-bottom: 1px solid var(--line); color: var(--text-dim); }
h1 { flex: 0 1 auto; max-width: 60%; font-size: 16px; margin: 0; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
src/ui/VoiceStage.svelte
+5 -4
View File
@@ -350,10 +350,11 @@
.away { flex: 1; margin: 0; display: flex; align-items: center; justify-content: center; color: #aaa; font-size: 13px; }
.vol { width: 110px; flex: none; padding: 0; }
/* Video only: the picture as wide as the chat, as tall as its shape asks */
.stage.solo { background: #000; }
.stage.solo .spot { flex: none; }
.stage.solo .pic { flex: none; display: block; }
.stage.solo .spot video { height: auto; max-height: 62vh; }
/* It gives way when the window is short, so the chat below keeps its last lines in view */
.stage.solo { flex: 0 1 auto; background: #000; }
.stage.solo .spot { flex: 0 1 auto; }
.stage.solo .pic { flex: 0 1 auto; flex-direction: column; }
.stage.solo .spot video { flex: 0 1 auto; height: auto; max-height: 62vh; }
.stage.solo .away { flex: none; padding: 24px; }
.wait { margin: 0; display: flex; align-items: center; gap: 8px; padding: 8px 12px; font-size: 13px; color: var(--text-dim); background: var(--bg-1); }
.wait span { flex: 1; min-width: 0; }