/ frontend / src / app / utils / themeColors.js
themeColors.js
 1  // Centralized semantic color tokens. Use these instead of literal hex
 2  // codes scattered across views — keeps status/role colors consistent
 3  // and gives one place to retune (or wire to a future dark-mode token
 4  // system) when design changes.
 5  //
 6  // Each value is the same hex literal previously inlined in views, so
 7  // migrating call-sites is purely visual-equivalent.
 8  
 9  export const colors = {
10    status: {
11      success: "#10b981", // green — healthy / public / configured
12      warning: "#f59e0b", // amber — restricted / partial / mid-strength
13      error:   "#ef4444", // red — admin / private / weak / disabled
14      info:    "#6366f1", // indigo — informational accents (team admin, locks)
15      muted:   "#6b7280", // gray — neutral / member / unknown
16    },
17    role: {
18      platformAdmin: "#ef4444",
19      teamAdmin:     "#6366f1",
20      member:        "#6b7280",
21    },
22  };
23  
24  // rgba helpers for badge backgrounds — kept inline since they always
25  // wrap one of the role/status colors above.
26  export const rgba = {
27    platformAdmin: "rgba(239, 68, 68, 0.12)",
28    teamAdmin:     "rgba(99, 102, 241, 0.12)",
29    member:        "rgba(107, 114, 128, 0.15)",
30  };