BivekiGroup/protekauto-frontend
4
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

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

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/Header.tsx
View File

@ -734,6 +734,11 @@ const Header: React.FC<HeaderProps> = ({ onOpenAuthModal = () => console.log('Au
</div>
</div>
<div className="w-layout-hflex flex-block-76">
<Link href="/profile-history" className="button_h w-inline-block">
<img src="/images/union.svg" alt="История заказов" width={22} height={10} />
</Link>
<Link href="/profile-gar" className="button_h w-inline-block">
<div className="code-embed-7 w-embed"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M27 10.8V24H24.6V13.2H5.4V24H3V10.8L15 6L27 10.8ZM23.4 14.4H6.6V16.8H23.4V14.4ZM23.4 18H6.6V20.4H23.4V18Z" fill="currentColor" /><path d="M6.6 21.6H23.4V24H6.6V21.6Z" fill="currentColor" /></svg></div>
<div className="text-block-2">Добавить в гараж</div>

16
src/components/profile/ProfileHistoryTabs.tsx
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})