Task #471: Make the incoming-note popup a single uniform color

The popup card was rendering in three visible shades of the note's
color: a darker header band, the note color in the body, and another
darker action-bar band — caused by `bg-black/5 dark:bg-white/5`
overlays plus dividers on the header and footer rows. The user wanted
the entire card to be a single flat color matching the note.

Changes (artifacts/tx-os/src/components/notes/incoming-note-popup.tsx):
- Drag handle / header row: removed
  `border-b border-black/10 dark:border-white/10 bg-black/5
  dark:bg-white/5`. The row is now fully transparent and inherits the
  outer card's `colorBg(noteColor)`.
- Action row: removed `border-t border-black/10 dark:border-white/10
  bg-black/5 dark:bg-white/5`. Same treatment — fully transparent, no
  divider line.
- The outer card div remains the only source of background color, so
  every region now shows the exact same shade in both light and dark
  mode.

Out of scope (untouched): avatar bg/ring, ping pulse, default-color
behavior (`bg-background` still kicks in for the default color),
animation, drag/pointer handlers, button layout.

Validation:
- `pnpm --filter @workspace/tx-os exec tsc --noEmit` passes.
- Pre-existing `test` workflow failures (executive-meetings PDF,
  notes-share, groups-crud) are unchanged and out of scope.
This commit is contained in:
Riyadh
2026-05-10 14:20:38 +00:00
parent 0c88b31f91
commit d7675fe3e7
@@ -490,7 +490,7 @@ export function IncomingNotePopup() {
onPointerMove={onHandlePointerMove}
onPointerUp={onHandlePointerEnd}
onPointerCancel={onHandlePointerEnd}
className="flex items-center gap-3 px-4 py-3 cursor-grab active:cursor-grabbing select-none border-b border-black/10 dark:border-white/10 bg-black/5 dark:bg-white/5 touch-none"
className="flex items-center gap-3 px-4 py-3 cursor-grab active:cursor-grabbing select-none touch-none"
data-testid="incoming-note-popup-drag-handle"
title={t("notes.popup.dragHint")}
>
@@ -566,7 +566,7 @@ export function IncomingNotePopup() {
</div>
{/* Action row */}
<div className="px-4 py-3 border-t border-black/10 dark:border-white/10 bg-black/5 dark:bg-white/5">
<div className="px-4 py-3">
<div className="flex flex-wrap gap-2 sm:flex-nowrap justify-end">
<Button
type="button"