feat: full responsive layout — mobile sidebar, stacked panels, fullscreen drawers
- AppShell: permanent sidebar on desktop, temporary drawer + hamburger on mobile (<md) - TopBar: hamburger icon on mobile, AI-Assistent als Icon-Button auf kleinen Screens - MatchDetail: Sidebar stacks below content on mobile, key facts wrap, px responsive - Properties: Drawer fullscreen (100vw) on mobile, 650px on desktop - ActiveInquiriesTab: mobile shows list → tap opens detail with back button - LatentInquiriesTab: mobile sequential navigation (list → detail → own properties), tablet 2-col, desktop 3-col - PublicNeedList: fullWidth prop for mobile layout - InquiryDetailPanel: property card stacks below chat on mobile Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import { useState } from 'react'
|
||||
import { Box, Drawer } from '@mui/material'
|
||||
import { Box, Drawer, useMediaQuery, useTheme } from '@mui/material'
|
||||
import { useNavigate } from 'react-router'
|
||||
import { PageHeader } from '../../components/layout'
|
||||
import { DecisionContextPanel } from '../../components/ui'
|
||||
@@ -49,6 +49,8 @@ function applyFilters(properties: Property[], filters: PropertyTableFilters): Pr
|
||||
|
||||
export default function Properties() {
|
||||
const navigate = useNavigate()
|
||||
const theme = useTheme()
|
||||
const isMobile = useMediaQuery(theme.breakpoints.down('md'))
|
||||
const [selectedId, setSelectedId] = useState<string | null>(null)
|
||||
const [filters, setFilters] = useState<PropertyTableFilters>({})
|
||||
const [view, setView] = useState<'list' | 'grid'>(() =>
|
||||
@@ -155,7 +157,7 @@ export default function Properties() {
|
||||
anchor="right"
|
||||
open={!!selectedId}
|
||||
onClose={() => setSelectedId(null)}
|
||||
slotProps={{ paper: { sx: { width: 650, boxShadow: '-4px 0 24px rgba(0,0,0,0.10)' } } }}
|
||||
slotProps={{ paper: { sx: { width: isMobile ? '100vw' : 650, boxShadow: '-4px 0 24px rgba(0,0,0,0.10)' } } }}
|
||||
>
|
||||
{selectedId && (
|
||||
<PropertyDetailView propertyId={selectedId} onClose={() => setSelectedId(null)} />
|
||||
|
||||
Reference in New Issue
Block a user