fix(helpdesk): neutral count badges, bordered tables, critical legend
- Count badge in section title is always neutral (no warning color) - Critical highlighting only on ticket number, not entire row - Ticket tables have border + border-radius + subtle header background matching the existing table widget pattern - Legend at bottom explains the warning color when critical tickets exist Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -143,7 +143,7 @@
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/* Count badge in section title */
|
||||
/* Count badge in section title — always neutral */
|
||||
.helpdesk-team-title-count {
|
||||
font-variant-numeric: tabular-nums;
|
||||
font-weight: 600;
|
||||
@@ -154,27 +154,27 @@
|
||||
color: var(--app-muted-color);
|
||||
}
|
||||
|
||||
.helpdesk-team-title-count-warning {
|
||||
background: color-mix(in srgb, var(--app-warning, #f59e0b) 15%, transparent);
|
||||
color: var(--app-warning, #f59e0b);
|
||||
}
|
||||
|
||||
/* Ticket table inside agent widget */
|
||||
/* Ticket table inside agent widget — bordered like table widgets */
|
||||
.helpdesk-team-ticket-table {
|
||||
width: 100%;
|
||||
font-size: var(--text-sm, 0.875rem);
|
||||
border: 1px solid var(--app-muted-border-color);
|
||||
border-radius: var(--app-radius, 0.375rem);
|
||||
border-spacing: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.helpdesk-team-ticket-table th {
|
||||
text-align: left;
|
||||
font-weight: 500;
|
||||
color: var(--app-muted-color);
|
||||
padding: calc(var(--app-spacing) * 0.25) calc(var(--app-spacing) * 0.4);
|
||||
padding: calc(var(--app-spacing) * 0.3) calc(var(--app-spacing) * 0.5);
|
||||
border-bottom: 1px solid var(--app-muted-border-color);
|
||||
background: color-mix(in srgb, var(--app-muted-border-color) 20%, transparent);
|
||||
}
|
||||
|
||||
.helpdesk-team-ticket-table td {
|
||||
padding: calc(var(--app-spacing) * 0.3) calc(var(--app-spacing) * 0.4);
|
||||
padding: calc(var(--app-spacing) * 0.35) calc(var(--app-spacing) * 0.5);
|
||||
border-bottom: 1px solid color-mix(in srgb, var(--app-muted-border-color) 40%, transparent);
|
||||
}
|
||||
|
||||
@@ -187,12 +187,37 @@
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.helpdesk-team-ticket-critical td {
|
||||
/* Critical: only highlight the ticket number, not the entire row */
|
||||
.helpdesk-team-ticket-critical .helpdesk-team-ticket-no {
|
||||
color: var(--app-warning, #f59e0b);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.helpdesk-team-ticket-critical .helpdesk-team-ticket-no {
|
||||
font-weight: 600;
|
||||
/* Legend */
|
||||
.helpdesk-team-legend {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: calc(var(--app-spacing) * 0.75);
|
||||
margin-top: calc(var(--app-spacing) * 0.75);
|
||||
font-size: var(--text-xs, 0.75rem);
|
||||
color: var(--app-muted-color);
|
||||
}
|
||||
|
||||
.helpdesk-team-legend-item {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.35em;
|
||||
}
|
||||
|
||||
.helpdesk-team-legend-dot {
|
||||
width: 0.55rem;
|
||||
height: 0.55rem;
|
||||
border-radius: 50%;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.helpdesk-team-legend-dot-warning {
|
||||
background: var(--app-warning, #f59e0b);
|
||||
}
|
||||
|
||||
/* Performance tab — compact rows */
|
||||
|
||||
Reference in New Issue
Block a user