UI: bruk play-symboler (◀ ▶) for revisjonspiler
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
bc0da66d2a
commit
52b71e6440
1 changed files with 41 additions and 44 deletions
|
|
@ -266,35 +266,31 @@
|
|||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
<!-- Flytende toolbar — gruppert: handlinger | forvaltning -->
|
||||
<div class="messagebox__toolbar">
|
||||
<div class="messagebox__toolbar-group">
|
||||
{#if callbacks.onReply}
|
||||
<button class="messagebox__toolbar-btn" title="Svar" onclick={handleReply}>💬</button>
|
||||
{/if}
|
||||
{#if isOwnMessage && !editing && callbacks.onEdit}
|
||||
<button class="messagebox__toolbar-btn" title="Rediger" onclick={startEdit}>✏️</button>
|
||||
{/if}
|
||||
{#if callbacks.onConvertToKanban}
|
||||
<button class="messagebox__toolbar-btn" title="Opprett kanban-kort" onclick={handleConvertToKanban}>📋</button>
|
||||
{/if}
|
||||
{#if callbacks.onConvertToCalendar}
|
||||
<button class="messagebox__toolbar-btn" title="Opprett kalenderhendelse" onclick={handleConvertToCalendar}>📅</button>
|
||||
{/if}
|
||||
{#if callbacks.onMagic}
|
||||
<button class="messagebox__toolbar-btn" title="AI-behandling" onclick={handleMagic} disabled={isAiProcessing}>✨</button>
|
||||
{/if}
|
||||
</div>
|
||||
{#if callbacks.onTogglePin || (isOwnMessage && !editing && callbacks.onDelete)}
|
||||
<div class="messagebox__toolbar-divider"></div>
|
||||
<div class="messagebox__toolbar-group">
|
||||
{#if callbacks.onTogglePin}
|
||||
<button class="messagebox__toolbar-btn" title={message.pinned ? 'Løsne' : 'Fest'} onclick={handleTogglePin}>📌</button>
|
||||
{/if}
|
||||
{#if isOwnMessage && !editing && callbacks.onDelete}
|
||||
<button class="messagebox__toolbar-btn messagebox__toolbar-btn--danger" title="Slett" onclick={handleDelete}>🗑️</button>
|
||||
{/if}
|
||||
</div>
|
||||
<!-- Øvre toolbar: opprett/transformer-handlinger -->
|
||||
<div class="messagebox__toolbar messagebox__toolbar--top">
|
||||
{#if isOwnMessage && !editing && callbacks.onEdit}
|
||||
<button class="messagebox__toolbar-btn" title="Rediger" onclick={startEdit}>✏️</button>
|
||||
{/if}
|
||||
{#if callbacks.onConvertToKanban}
|
||||
<button class="messagebox__toolbar-btn" title="Opprett kanban-kort" onclick={handleConvertToKanban}>📋</button>
|
||||
{/if}
|
||||
{#if callbacks.onConvertToCalendar}
|
||||
<button class="messagebox__toolbar-btn" title="Opprett kalenderhendelse" onclick={handleConvertToCalendar}>📅</button>
|
||||
{/if}
|
||||
{#if callbacks.onMagic}
|
||||
<button class="messagebox__toolbar-btn" title="AI-behandling" onclick={handleMagic} disabled={isAiProcessing}>✨</button>
|
||||
{/if}
|
||||
</div>
|
||||
<!-- Nedre toolbar: samtale-handlinger -->
|
||||
<div class="messagebox__toolbar messagebox__toolbar--bottom">
|
||||
{#if callbacks.onReply}
|
||||
<button class="messagebox__toolbar-btn" title="Svar" onclick={handleReply}>💬</button>
|
||||
{/if}
|
||||
{#if callbacks.onTogglePin}
|
||||
<button class="messagebox__toolbar-btn" title={message.pinned ? 'Løsne' : 'Fest'} onclick={handleTogglePin}>📌</button>
|
||||
{/if}
|
||||
{#if isOwnMessage && !editing && callbacks.onDelete}
|
||||
<button class="messagebox__toolbar-btn messagebox__toolbar-btn--danger" title="Slett" onclick={handleDelete}>🗑️</button>
|
||||
{/if}
|
||||
</div>
|
||||
{#if confirmingDelete}
|
||||
|
|
@ -349,8 +345,8 @@
|
|||
{/if}
|
||||
</button>
|
||||
{#if showingRevision}
|
||||
<button class="messagebox__revision-nav" onclick={prevRevision} disabled={revisionIndex >= revisions.length - 1}>←</button>
|
||||
<button class="messagebox__revision-nav" onclick={nextRevision}>→</button>
|
||||
<button class="messagebox__revision-nav" onclick={prevRevision} disabled={revisionIndex >= revisions.length - 1}>◀</button>
|
||||
<button class="messagebox__revision-nav" onclick={nextRevision}>▶</button>
|
||||
{#if revisionIndex >= 0}
|
||||
<button class="messagebox__revision-toggle" onclick={(e) => { e.stopPropagation(); revisionIndex = -1; }}>
|
||||
nåværende
|
||||
|
|
@ -456,10 +452,9 @@
|
|||
font-size: 0.65rem;
|
||||
}
|
||||
|
||||
/* === Flytende toolbar (absolutt-posisjonert, ingen layout-shift) === */
|
||||
/* === Flytende toolbars (absolutt-posisjonert, ingen layout-shift) === */
|
||||
.messagebox__toolbar {
|
||||
position: absolute;
|
||||
top: -0.6rem;
|
||||
right: 0.4rem;
|
||||
display: flex;
|
||||
gap: 0.1rem;
|
||||
|
|
@ -473,11 +468,24 @@
|
|||
z-index: 5;
|
||||
}
|
||||
|
||||
.messagebox__toolbar--top {
|
||||
top: -0.6rem;
|
||||
}
|
||||
|
||||
.messagebox__toolbar--bottom {
|
||||
bottom: -0.6rem;
|
||||
}
|
||||
|
||||
.messagebox--expanded:hover .messagebox__toolbar {
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* Skjul tomme toolbars (kun har betingede barn) */
|
||||
.messagebox__toolbar:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.messagebox__toolbar-btn {
|
||||
font-size: 0.7rem;
|
||||
background: none;
|
||||
|
|
@ -497,17 +505,6 @@
|
|||
background: rgba(220, 38, 38, 0.25);
|
||||
}
|
||||
|
||||
.messagebox__toolbar-group {
|
||||
display: flex;
|
||||
gap: 0.1rem;
|
||||
}
|
||||
|
||||
.messagebox__toolbar-divider {
|
||||
width: 1px;
|
||||
background: #2d3148;
|
||||
margin: 0.1rem 0.15rem;
|
||||
}
|
||||
|
||||
.messagebox__confirm-delete {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue