Skip to content

Team screen restyle + shared Button control - #506

Draft
nghtctrl wants to merge 30 commits into
sillsdev:developfrom
nghtctrl:button-changes
Draft

Team screen restyle + shared Button control#506
nghtctrl wants to merge 30 commits into
sillsdev:developfrom
nghtctrl:button-changes

Conversation

@nghtctrl

@nghtctrl nghtctrl commented Aug 14, 2026

Copy link
Copy Markdown

Changes:

  • New control/Button.tsx: MUI Button that wraps its label in <Typography noWrap variant="button"> so text ellipsizes instead of wrapping; disableTypography opts out for icon-only content. Exported from control/index.ts
  • New Team/TeamPanel.tsx: bordered icon/title/actions header over a Grid container spaced on theme.layout.gap. TeamItem and PersonalItem now use it; the old TeamPaper / TeamHeadDiv / TeamName controls are deleted
  • New Team/CardSize.tsx + useCardSize.ts: cards report the height their content needs and read back the maximum, so project/add cards across all team panels share the tallest card's height (floor 176px). Heights live in a ref so a card re-measuring only re-renders when the max moves
  • theme.ts button styling rebuilt around a named colors map with explicit hover/active/disabled per variant+color; outlined is now the default variant, contained primary dark / contained secondary light, plus size-based heights (28/36/44). Removed the IconButton variant augmentation and the containedBg / containedHoverBg / BUTTON_SHADOW exports that existed only to mimic it. Secondary #00A7E1 (this was actually just primary.light color) → #90a828 (green olive color extracted from APM logo); added palette.custom.black
  • ProjectCard and AddCard rebuilt as Grid items with a CardActionArea and the shared height; ProjectMenu absolutely positioned in the card corner, ProjectDialog lifted out of the clickable area. Icons: BsPencilSquareEditSquareIcon, hand-drawn "B" → FormatBoldIcon
  • TeamScreen and TeamProjects Grid layouts replaced with flex Box (sidebar + vertical Divider + scrollable content); AltButtonButton in TeamActions, TeamItem, PersonalItem
  • New subscribePendingMediaUploads dispatches a window event on save (localStorage storage events only reach other windows); TeamActions consumes it via useSyncExternalStore so the badge count is live instead of refreshing only on dialog open/close. Test added
  • Hard-coded margins/paddings replaced with theme.layout.gap

Associated issues that this addresses: TT-7449, TT-7587

…el wrapper + add some docstring explaining the component
…t using theme layout gap and a vertical Divider
…me layout gap and wrap it in CardSizeProvider
…ared height, and an absolutely positioned ProjectMenu
…rd height, and lift ProjectDialog out of the card
@nghtctrl
nghtctrl marked this pull request as draft August 17, 2026 20:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant