Grade comments: dropdown matches input width, compact tone select, responsive wrap

This commit is contained in:
2026-09-29 16:09:39 +03:00
parent 2869142a79
commit 751d6bae42
2 changed files with 16 additions and 7 deletions

View File

@@ -304,11 +304,14 @@ code.code { padding: 0.125rem 0.5rem; border-radius: 0.25rem; font-family: monos
.chip-neu { background: #5d6570; color: #fff; }
.chip-neg { background: #b3283b; color: #fff; }
/* Слоты комментариев в диалоге */
.cs-row { display: flex; gap: 6px; align-items: center; position: relative; }
.cs-row .cs-text { flex: 1 1 auto; min-width: 0; }
.cs-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.cs-text-wrap { position: relative; flex: 1 1 12rem; min-width: 0; }
.cs-text-wrap .cs-text { width: 100%; }
.cs-row .cs-tone, .cs-row .btn { flex: 0 0 auto; }
.cs-tone { max-width: 9rem; }
.ac-list {
position: absolute; left: 0; top: 100%; margin-top: 2px; z-index: 20;
min-width: 100%; max-height: 14rem; overflow-y: auto;
position: absolute; left: 0; right: 0; top: 100%; margin-top: 2px; z-index: 20;
max-height: 14rem; overflow-y: auto;
background: var(--c-surface); border: 1px solid var(--c-border);
border-radius: 0.4rem; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

View File

@@ -35,14 +35,19 @@ function csRow(text, tone) {
var row = document.createElement('div');
row.className = 'cs-row';
var wrap = document.createElement('div');
wrap.className = 'cs-text-wrap';
var inp = document.createElement('input');
inp.className = 'input cs-text';
inp.placeholder = 'Комментарий';
inp.value = text || '';
wrap.appendChild(inp);
var sel = document.createElement('select');
sel.className = 'input cs-tone';
[['positive', '+ позитивный'], ['negative', '— негативный'], ['neutral', '○ нейтральный']].forEach(function (o) {
sel.title = 'Тональность комментария';
[['positive', '+ позитив'], ['negative', '— негатив'], ['neutral', '○ нейтрал']].forEach(function (o) {
var op = document.createElement('option');
op.value = o[0];
op.textContent = o[1];
@@ -56,7 +61,7 @@ function csRow(text, tone) {
rm.textContent = 'удалить';
rm.onclick = function () { row.remove(); };
row.appendChild(inp);
row.appendChild(wrap);
row.appendChild(sel);
row.appendChild(rm);
box.appendChild(row);
@@ -138,7 +143,8 @@ function attachCommentAutocomplete(input) {
if (event.target.closest('.ac-del')) return;
event.preventDefault();
input.value = item.text;
var tone = input.parentNode.querySelector('.cs-tone');
var rowEl = input.closest('.cs-row');
var tone = rowEl ? rowEl.querySelector('.cs-tone') : null;
if (tone && item.tone) tone.value = item.tone;
hide();
});