adam/proposal-system
1
0
Fork 0
mirror of https://github.com/Sea-Haven-Industries/proposal-system.git synced 2026-09-30 07:43:14 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

topbar: update avatar color, add DEV environment indicator pill

Browse source
This commit is contained in:
Adam Moussa 2026-05-22 18:50:39 -04:00
parent b21e5db08a
commit cef0b611ba
1 changed files with 25 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
web/src/components/Topbar.tsx
View file

@ -13,6 +13,8 @@ export default function Topbar() {
? user.displayName.split(' ').map(n => n[0]).join('').toUpperCase().slice(0, 2)
: '';
const isDevMode = !import.meta.env.VITE_COGNITO_DOMAIN;
return (
<AppBar position="fixed" sx={{ zIndex: (theme) => theme.zIndex.drawer + 1, height: 64 }}>
<Toolbar sx={{ height: 64, minHeight: 64 }}>
@ -27,11 +29,33 @@ export default function Topbar() {
</IconButton>
<Typography variant="h6" noWrap sx={{ flexGrow: 1, fontWeight: 600 }}>
Proposal System
{isDevMode && (
<Box
component="span"
sx={{
background: '#FEF3C7',
color: '#92400E',
border: '1px solid #FCD34D',
height: 22,
borderRadius: '999px',
fontSize: '11px',
fontWeight: 700,
pl: '8px',
pr: '8px',
display: 'inline-flex',
alignItems: 'center',
ml: '12px',
verticalAlign: 'middle',
}}
>
DEV
</Box>
)}
</Typography>
{user && (
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1.5 }}>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
<Avatar sx={{ width: 32, height: 32, bgcolor: '#1B789B', fontSize: 12, fontWeight: 600 }}>
<Avatar sx={{ width: 32, height: 32, bgcolor: '#0E7490', fontSize: 12, fontWeight: 600 }}>
{initials}
</Avatar>
<Box sx={{ display: 'flex', flexDirection: 'column', lineHeight: 1.2 }}>