адаптация мобилок от 1743

This commit is contained in:
egortriston
2025-07-07 17:43:33 +03:00
parent 391d47ed2b
commit aeff49ae78
5 changed files with 131 additions and 32 deletions

View File

@ -69,7 +69,7 @@ const ProfileHistoryTabs: React.FC<ProfileHistoryTabsProps> = ({
{tabs.map((tab) => (
<div
key={tab}
className={`flex flex-1 shrink gap-5 items-center h-full text-center rounded-xl basis-12 min-w-[240px] ${
className={`flex flex-1 shrink gap-5 items-center h-full text-center rounded-xl basis-12 min-w-[200px] ${
activeTab === tab
? "text-white"
: "bg-slate-200 text-gray-950"
@ -78,7 +78,7 @@ const ProfileHistoryTabs: React.FC<ProfileHistoryTabsProps> = ({
onClick={() => onTabChange(tab)}
>
<div
className={`flex-1 shrink gap-5 self-stretch px-6 py-3.5 my-auto w-full rounded-xl basis-0 min-w-[240px] max-md:px-5 ${
className={`flex-1 shrink gap-5 self-stretch px-6 py-3.5 my-auto w-full rounded-xl basis-0 min-w-[200px] max-md:px-5 ${
activeTab === tab
? "text-white bg-red-600"
: "bg-slate-200 text-gray-950"
@ -89,12 +89,12 @@ const ProfileHistoryTabs: React.FC<ProfileHistoryTabsProps> = ({
</div>
))}
<div
className="relative w-[240px] max-w-full max-sm:w-full"
className="relative w-[300px] max-w-full max-sm:w-full"
ref={dropdownRef}
tabIndex={0}
>
<div
className="flex justify-between items-center px-6 py-4 text-sm leading-snug bg-white rounded border border-solid border-stone-300 text-neutral-500 cursor-pointer select-none w-full"
className="flex justify-between items-center px-6 py-4 text-sm leading-snug bg-white rounded border border-solid border-stone-300 text-neutral-500 cursor-pointer select-none w-full min-w-[200px]"
onClick={() => setIsDropdownOpen((prev) => !prev)}
>
<span className="truncate">{selectedManufacturer}</span>
@ -111,21 +111,21 @@ const ProfileHistoryTabs: React.FC<ProfileHistoryTabsProps> = ({
</span>
</div>
{isDropdownOpen && (
<ul className="absolute left-0 top-full z-10 bg-white border-x border-b border-stone-300 rounded-b-lg shadow-lg w-full max-h-60 overflow-y-auto">
<ul className="absolute px-0 pb-2 pl-0 list-none left-0 top-full z-10 bg-white border-x border-b border-stone-300 rounded-b-lg shadow-lg w-full max-h-60 overflow-y-auto dropdown-scroll-invisible">
{manufacturers.length === 0 ? (
<li className="px-6 py-4 text-gray-400 text-center">
<li className="py-2 text-xs text-gray-400 text-center">
Нет данных
</li>
) : (
manufacturers.map((manufacturer) => (
<li
key={manufacturer}
className={`px-6 py-4 cursor-pointer hover:bg-blue-100 transition-colors ${manufacturer === selectedManufacturer ? 'bg-blue-50 font-semibold text-blue-600' : ''}`}
className={`py-2 px-5 text-sm cursor-pointer hover:bg-blue-100 transition-colors ${manufacturer === selectedManufacturer ? 'bg-blue-50 text-red-600 font-normal' : 'text-neutral-500 font-medium'}`}
onMouseDown={() => handleManufacturerSelect(manufacturer)}
>
{manufacturer}
{manufacturer !== "Все" && (
<span className="ml-2 text-xs text-gray-400">
<span className="ml-2 text-[10px] text-gray-400">
({historyItems.filter(item =>
item.brand === manufacturer || item.vehicleInfo?.brand === manufacturer
).length})