fix: menu contextuel — tous les tags visibles + sélection couleur en grille
- loadWorkspaceTags() utilise /api/settings/tags/all (TOUS les tags, pas seulement ceux déjà utilisés via JOIN page_tags). Avant: 2/6 tags visibles. - Nouvelle grille couleurs 'New tag': grid 7 colonnes × 2 rangées, carrés responsifs via padding-bottom:100%. + bouton Add à droite. - .ctx-menu: max-height:80vh + overflow-y:auto → plus de clipping en bas de fenêtre. z-index 600 (au-dessus du settings panel). - .color-swatch-ctx: carrés parfaits dans la grid, hover scale 1.15
This commit is contained in:
@@ -269,7 +269,7 @@
|
||||
.view-menu-item.active{background:rgba(35,131,226,.12);color:var(--accent);font-weight:500;}
|
||||
|
||||
/* Context menu */
|
||||
.ctx-menu{position:fixed;z-index:300;background:#1E1E1E;border:1px solid var(--border-strong);border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,.7);min-width:180px;overflow:hidden;padding:4px 0;}
|
||||
.ctx-menu{position:fixed;background:#1E1E1E;border:1px solid var(--border-strong);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.5);min-width:200px;z-index:600;padding:4px 0;max-height:80vh;overflow-y:auto;}
|
||||
.ctx-item{display:flex;align-items:center;gap:8px;padding:7px 14px;font-size:13px;color:var(--text);cursor:pointer;transition:background 100ms;}
|
||||
.ctx-item:hover{background:var(--bg-hover);}
|
||||
.ctx-item.ctx-danger{color:var(--danger);}
|
||||
@@ -280,8 +280,8 @@
|
||||
.ctx-tag-add:hover{color:var(--accent);}
|
||||
.ctx-section{padding:5px 14px;font-size:11px;font-weight:600;color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px;}
|
||||
.ctx-tag-color{width:10px;height:10px;border-radius:50%;flex-shrink:0;}
|
||||
.color-swatch-ctx{width:18px;height:18px;border-radius:4px;cursor:pointer;border:2px solid transparent;transition:all 100ms;}
|
||||
.color-swatch-ctx:hover{transform:scale(1.15);}
|
||||
.color-swatch-ctx{width:100%;padding-bottom:100%;border-radius:5px;cursor:pointer;border:2px solid transparent;transition:all 100ms;box-sizing:border-box;position:relative;}
|
||||
.color-swatch-ctx:hover{transform:scale(1.15);z-index:1;}
|
||||
.color-swatch-ctx.selected{border-color:var(--text);box-shadow:0 0 0 2px var(--accent);}
|
||||
.ctx-add-tag-item:hover{background:rgba(35,131,226,.08);}
|
||||
.ctx-has-sub{justify-content:space-between;}
|
||||
@@ -804,17 +804,22 @@
|
||||
<span style="flex:1;">➕ New tag</span>
|
||||
<span x-text="ctxTagAdding ? '▾' : '▸'"></span>
|
||||
</div>
|
||||
<div x-show="ctxTagAdding" style="display:flex;align-items:center;gap:4px;padding:4px 14px;">
|
||||
<template x-for="c in ctxTagColors" :key="c">
|
||||
<div class="color-swatch-ctx" :class="{ selected: ctxNewTagColor === c }"
|
||||
:style="{background: c}" @click.stop="ctxNewTagColor=c"></div>
|
||||
</template>
|
||||
<input class="tag-input" x-ref="ctxTagInput"
|
||||
@keydown.enter="ctxAddNewTag($event.target.value); $event.target.value=''"
|
||||
@keydown.escape="ctxTagAdding=false"
|
||||
@click.stop
|
||||
placeholder="tag name..."
|
||||
style="margin-left:4px;">
|
||||
<div x-show="ctxTagAdding" style="padding:6px 10px;background:var(--bg-tertiary);border-radius:6px;margin:2px 6px;">
|
||||
<div style="display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:6px;">
|
||||
<template x-for="c in ctxTagColors" :key="c">
|
||||
<div class="color-swatch-ctx" :class="{ selected: ctxNewTagColor === c }"
|
||||
:style="{background: c}" @click.stop="ctxNewTagColor=c"></div>
|
||||
</template>
|
||||
</div>
|
||||
<div style="display:flex;gap:4px;">
|
||||
<input class="tag-input" x-ref="ctxTagInput"
|
||||
@keydown.enter="ctxAddNewTag($event.target.value); $event.target.value=''"
|
||||
@keydown.escape="ctxTagAdding=false"
|
||||
@click.stop
|
||||
placeholder="Tag name..."
|
||||
style="flex:1;">
|
||||
<button class="btn btn-primary" @click.stop="ctxAddNewTag($refs.ctxTagInput.value); $refs.ctxTagInput.value=''" style="padding:2px 10px;font-size:12px;">Add</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ctx-sep"></div>
|
||||
<div class="ctx-item ctx-danger" @click="ctxMenuDelete()">🗑 Delete</div>
|
||||
@@ -2238,7 +2243,7 @@ document.addEventListener('alpine:init', function() {
|
||||
// ── Tag management ──
|
||||
async loadWorkspaceTags() {
|
||||
try {
|
||||
var r = await fetch('/api/local-workspace/tags');
|
||||
var r = await fetch('/api/settings/tags/all');
|
||||
var d = await r.json();
|
||||
this.workspaceTags = d.tags || [];
|
||||
} catch(e) { this.workspaceTags = []; }
|
||||
|
||||
Reference in New Issue
Block a user