esdras/sistema-de-chamados
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Editor mentions: style [data-type=ticketMention] with colored status dot via ::before to match display chips

Browse source
This commit is contained in:
codex-bot 2025-10-24 14:31:55 -03:00
parent 3b013f205a
commit b3fa6955b7
1 changed files with 12 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/app/globals.css
View file

@ -174,7 +174,18 @@
/* While editing, TipTap renders the mention as a span with data-type="ticketMention". /* While editing, TipTap renders the mention as a span with data-type="ticketMention".
Mirror the same chip style so the layout stays consistent during edits. */ Mirror the same chip style so the layout stays consistent during edits. */
.rich-text .ProseMirror [data-type="ticketMention"] { .rich-text .ProseMirror [data-type="ticketMention"] {
@apply inline-flex items-center gap-2 rounded-full border border-slate-200 bg-slate-100 px-2.5 py-1 text-xs font-semibold text-neutral-800; @apply inline-flex items-center gap-2 rounded-full border border-slate-200 bg-slate-100 px-2.5 py-1 text-xs font-semibold text-neutral-800 align-middle;
position: relative;
}
.rich-text .ProseMirror [data-type="ticketMention"]::before {
content: "";
@apply inline-block size-2 rounded-full bg-slate-400;
margin-right: 0.375rem; /* ~gap-1.5 */
}
.rich-text .ProseMirror [data-type="ticketMention"][status="PENDING"]::before { @apply bg-amber-400; }
.rich-text .ProseMirror [data-type="ticketMention"][status="AWAITING_ATTENDANCE"]::before { @apply bg-sky-500; }
.rich-text .ProseMirror [data-type="ticketMention"][status="PAUSED"]::before { @apply bg-violet-500; }
.rich-text .ProseMirror [data-type="ticketMention"][status="RESOLVED"]::before { @apply bg-emerald-500; }
} }
.rich-text [data-ticket-mention="true"] .ticket-mention-dot, .rich-text [data-ticket-mention="true"] .ticket-mention-dot,
.rich-text .ticket-mention .ticket-mention-dot { .rich-text .ticket-mention .ticket-mention-dot {