fix: icon spacing, scheme bg, drawer layout, filter margin, cart icon states
This commit is contained in:
@@ -156,7 +156,19 @@ export function AppHeader() {
|
||||
|
||||
{!isMobile && (
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5, ml: 1.5 }}>
|
||||
<SchemeSwitcher value={scheme} onChange={(s: ColorScheme) => setScheme(s)} />
|
||||
<Box
|
||||
sx={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: 0.5,
|
||||
bgcolor: 'action.hover',
|
||||
borderRadius: 3,
|
||||
px: 0.5,
|
||||
py: 0.25,
|
||||
}}
|
||||
>
|
||||
<SchemeSwitcher value={scheme} onChange={(s: ColorScheme) => setScheme(s)} />
|
||||
</Box>
|
||||
<ModeSwitcher mode={mode} resolvedMode={resolvedMode} onCycleMode={cycleMode} />
|
||||
</Box>
|
||||
)}
|
||||
|
||||
@@ -2,7 +2,7 @@ import IconButton from '@mui/material/IconButton'
|
||||
import Tooltip from '@mui/material/Tooltip'
|
||||
import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
|
||||
import { useUnit } from 'effector-react'
|
||||
import { ShoppingCart } from 'lucide-react'
|
||||
import { CirclePlus, ShoppingCart } from 'lucide-react'
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
import { addToCart, fetchMyCart, removeCartItem } from '@/entities/cart/api/cart-api'
|
||||
import { $user } from '@/shared/model/auth'
|
||||
@@ -63,7 +63,7 @@ export function ToggleCartIcon(props: {
|
||||
<Tooltip title={tooltip}>
|
||||
<span>
|
||||
<IconButton size={size} onClick={onClick} disabled={disabled || busy} aria-label={tooltip} type="button">
|
||||
{user ? inCart ? <ShoppingCart /> : <ShoppingCart /> : <ShoppingCart />}
|
||||
{user ? (inCart ? <ShoppingCart /> : <CirclePlus />) : <ShoppingCart />}
|
||||
</IconButton>
|
||||
</span>
|
||||
</Tooltip>
|
||||
|
||||
@@ -79,11 +79,13 @@ export function HomePage() {
|
||||
Игрушки, сувениры и другие изделия ручной работы.
|
||||
</Typography>
|
||||
|
||||
<ProductFilters
|
||||
{...filters}
|
||||
categories={categoriesQuery.data ?? []}
|
||||
categoriesLoading={categoriesQuery.isLoading}
|
||||
/>
|
||||
<Box sx={{ mb: 3 }}>
|
||||
<ProductFilters
|
||||
{...filters}
|
||||
categories={categoriesQuery.data ?? []}
|
||||
categoriesLoading={categoriesQuery.isLoading}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
{productsQuery.isLoading && (
|
||||
<Grid container spacing={2} sx={{ mt: 2 }}>
|
||||
|
||||
@@ -92,8 +92,8 @@ export function NavigationDrawer({
|
||||
|
||||
<Divider sx={{ my: 2 }} />
|
||||
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2, alignItems: 'flex-start' }}>
|
||||
<SchemeSwitcher value={scheme} onChange={onSchemeChange} orientation="vertical" />
|
||||
<Box sx={{ display: 'flex', flexDirection: 'row', gap: 2, alignItems: 'center', flexWrap: 'wrap' }}>
|
||||
<SchemeSwitcher value={scheme} onChange={onSchemeChange} orientation="horizontal" />
|
||||
<ModeSwitcher mode={mode} resolvedMode={resolvedMode} onCycleMode={onCycleMode} />
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
Reference in New Issue
Block a user