mirror of
https://github.com/Memo-2023/mana-monorepo.git
synced 2026-05-15 00:41:09 +02:00
fix(ui): move nav toggle to right side of InputBar, make it larger
- Add rightAction snippet prop to QuickInputBar (InputBar.svelte) - Move toggle from leftAction to rightAction (renders after submit button) - Increase toggle size from 28px to 36px for better tap target Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
06ebc6271d
commit
976fb5fdf8
2 changed files with 15 additions and 4 deletions
|
|
@ -408,7 +408,7 @@
|
|||
highlightPatterns={inputBarAdapter.highlightPatterns}
|
||||
positioning="static"
|
||||
>
|
||||
{#snippet leftAction()}
|
||||
{#snippet rightAction()}
|
||||
<button
|
||||
class="pill-nav-toggle"
|
||||
onclick={() => handleCollapsedChange(!isCollapsed)}
|
||||
|
|
@ -533,8 +533,8 @@
|
|||
}
|
||||
|
||||
.pill-nav-toggle {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
flex-shrink: 0;
|
||||
border-radius: 50%;
|
||||
border: none;
|
||||
|
|
|
|||
|
|
@ -75,6 +75,8 @@
|
|||
onShowSyntaxHelp?: () => void;
|
||||
/** Snippet for left action button (e.g., voice input) - rendered inside the input bar on the left */
|
||||
leftAction?: Snippet;
|
||||
/** Snippet for right action button (e.g., nav toggle) - rendered inside the input bar on the right */
|
||||
rightAction?: Snippet;
|
||||
/** Custom highlight patterns. If not provided, uses locale-based defaults. */
|
||||
highlightPatterns?: HighlightPattern[];
|
||||
/** Locale for syntax highlighting keywords (e.g., 'de', 'en'). Default: 'de'. */
|
||||
|
|
@ -107,6 +109,7 @@
|
|||
onShowShortcuts,
|
||||
onShowSyntaxHelp,
|
||||
leftAction,
|
||||
rightAction,
|
||||
highlightPatterns,
|
||||
locale = 'de',
|
||||
positioning = 'fixed',
|
||||
|
|
@ -538,6 +541,13 @@
|
|||
{/if}
|
||||
</button>
|
||||
{/if}
|
||||
|
||||
<!-- Right action slot (e.g., nav toggle) -->
|
||||
{#if rightAction}
|
||||
<div class="right-action">
|
||||
{@render rightAction()}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<!-- Context Menu -->
|
||||
|
|
@ -663,7 +673,8 @@
|
|||
}
|
||||
}
|
||||
|
||||
.left-action {
|
||||
.left-action,
|
||||
.right-action {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue