Feedback iteration: DialogShell, page consistency, popup standardisation
- Add DialogShell atom — shared dialog container (header, scrollable body, footer)
- Refactor FilterPanel to use DialogShell (Popover → centered Dialog)
- Refactor ArrangementDialog to use DialogShell
- Remove PreviewStep + AuthGateStep pages (consolidated into ArrangementDialog, D-E)
- IntroStep: static subheading, top-left aligned toggle button content
- ProvidersStep: h4 heading "Find a funeral director", location search with pin icon,
filter moved below search right-aligned, map fill fix, hover scrollbar
- VenueStep: same consistency fixes (h4 heading, filter layout, location icon, map fix)
- PackagesStep: grouped packages ("Matching your preferences" / "Other packages from
[Provider]"), removed budget filter + Most Popular badge, clickable provider card,
onArrange replaces onContinue, h4 heading
- WizardLayout: list-map left panel gets thin scrollbar visible on hover
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -170,6 +170,7 @@ const ListMapLayout: React.FC<{
|
||||
overflow: 'hidden',
|
||||
}}
|
||||
>
|
||||
{/* Left panel — scrollable list with scrollbar visible on hover */}
|
||||
<Box
|
||||
sx={{
|
||||
width: { xs: '100%', md: 420 },
|
||||
@@ -177,16 +178,31 @@ const ListMapLayout: React.FC<{
|
||||
overflowY: 'auto',
|
||||
px: { xs: 2, md: 3 },
|
||||
py: 3,
|
||||
// Thin scrollbar, hidden until hover
|
||||
scrollbarWidth: 'thin',
|
||||
scrollbarColor: 'transparent transparent',
|
||||
'&:hover': {
|
||||
scrollbarColor: 'rgba(0,0,0,0.25) transparent',
|
||||
},
|
||||
'&::-webkit-scrollbar': { width: 6 },
|
||||
'&::-webkit-scrollbar-thumb': {
|
||||
background: 'transparent',
|
||||
borderRadius: 3,
|
||||
},
|
||||
'&:hover::-webkit-scrollbar-thumb': {
|
||||
background: 'rgba(0,0,0,0.25)',
|
||||
},
|
||||
}}
|
||||
>
|
||||
{backLink}
|
||||
{children}
|
||||
</Box>
|
||||
{/* Right panel — map or placeholder, fills available space */}
|
||||
<Box
|
||||
sx={{
|
||||
display: { xs: 'none', md: 'flex' },
|
||||
flex: 1,
|
||||
position: 'relative',
|
||||
minHeight: 0,
|
||||
}}
|
||||
>
|
||||
{secondaryPanel}
|
||||
|
||||
Reference in New Issue
Block a user