improve(messages): compact inline layout for member picker list
Some checks are pending
NordaBiz Tests / Unit & Integration Tests (push) Waiting to run
NordaBiz Tests / E2E Tests (Playwright) (push) Blocked by required conditions
NordaBiz Tests / Smoke Tests (Production) (push) Blocked by required conditions
NordaBiz Tests / Send Failure Notification (push) Blocked by required conditions
Some checks are pending
NordaBiz Tests / Unit & Integration Tests (push) Waiting to run
NordaBiz Tests / E2E Tests (Playwright) (push) Blocked by required conditions
NordaBiz Tests / Smoke Tests (Production) (push) Blocked by required conditions
NordaBiz Tests / Send Failure Notification (push) Blocked by required conditions
Name and company in one line separated by | pipe, smaller avatars, tighter padding for more compact member selection. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
3e26f1e289
commit
43b48983c4
@ -224,8 +224,8 @@
|
||||
.member-list-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--spacing-sm);
|
||||
padding: var(--spacing-sm) var(--spacing-md);
|
||||
gap: var(--spacing-xs);
|
||||
padding: 6px var(--spacing-md);
|
||||
cursor: pointer;
|
||||
transition: background 0.15s;
|
||||
}
|
||||
@ -244,16 +244,16 @@
|
||||
}
|
||||
|
||||
.member-list-avatar {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.member-list-initial {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 50%;
|
||||
background: var(--primary);
|
||||
color: white;
|
||||
@ -261,19 +261,29 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-weight: 600;
|
||||
font-size: var(--font-size-sm);
|
||||
font-size: 12px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.member-list-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.member-list-name {
|
||||
font-weight: 500;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--text-primary);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.member-list-sep {
|
||||
color: var(--border-color, #cbd5e1);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.member-list-company {
|
||||
@ -421,13 +431,13 @@
|
||||
var avatarHtml = u.avatarPath
|
||||
? '<img src="' + u.avatarPath + '" class="member-list-avatar" alt="">'
|
||||
: '<div class="member-list-initial">' + initial + '</div>';
|
||||
var companyHtml = u.companyName ? '<div class="member-list-company">' + u.companyName + '</div>' : '';
|
||||
var companyHtml = u.companyName ? '<span class="member-list-sep">|</span><span class="member-list-company">' + u.companyName + '</span>' : '';
|
||||
|
||||
return '<label class="member-list-item' + selectedClass + '" data-user-id="' + u.id + '">' +
|
||||
'<input type="checkbox" ' + checked + ' data-id="' + u.id + '" style="width:auto;">' +
|
||||
avatarHtml +
|
||||
'<div class="member-list-info">' +
|
||||
'<div class="member-list-name">' + u.name + '</div>' +
|
||||
'<span class="member-list-name">' + u.name + '</span>' +
|
||||
companyHtml +
|
||||
'</div>' +
|
||||
'</label>';
|
||||
|
||||
Loading…
Reference in New Issue
Block a user