inmake/irth-new-client
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

started favorites compare

Browse Source
This commit is contained in:
Lanskikh
2025-05-15 19:03:24 +05:00
parent 224c6499cf
commit 501ed130be
9 changed files with 400 additions and 141 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Footer.tsx
+44 -44
View File
@@ -1,109 +1,109 @@
import { Link } from 'react-router';
import YoutubeIcon from './icons/YoutubeIcon';
import InstagramIcon from './icons/InstagramIcon';
import FacebookIcon from './icons/FacebookIcon';
import LinkedInIcon from './icons/LinkedInIcon';
import TwitterIcon from './icons/TwitterIcon';
import ChevronDownIcon from './icons/ChevronDownIcon';
import { Link } from "react-router";
import YoutubeIcon from "./icons/YoutubeIcon";
import InstagramIcon from "./icons/InstagramIcon";
import FacebookIcon from "./icons/FacebookIcon";
import LinkedInIcon from "./icons/LinkedInIcon";
import TwitterIcon from "./icons/TwitterIcon";
import ChevronDownIcon from "./icons/ChevronDownIcon";
function Footer() {
return (
<footer className='z-1 2xl:px-[2.222vw] 2xl:pb-[2.222vw] 2xl:pt-[2.778vw] md:max-2xl:p-6 px-4 py-6 grid 2xl:grid-cols-6 md:max-2xl:grid-cols-4 grid-cols-2 2xl:grid-rows-2 2xl:gap-x-[1.667vw] 2xl:gap-y-[1.111vw] max-2xl:gap-y-6 2xl:rounded-t-[1.667vw] rounded-t-3xl outline outline-[#E2E2DC] bg-white'>
<footer className="z-1 2xl:px-[2.222vw] 2xl:pb-[2.222vw] 2xl:pt-[2.778vw] md:max-2xl:p-6 px-4 py-6 grid 2xl:grid-cols-6 md:max-2xl:grid-cols-4 grid-cols-2 2xl:grid-rows-2 2xl:gap-x-[1.667vw] 2xl:gap-y-[1.111vw] max-2xl:gap-y-6 2xl:rounded-t-[1.667vw] rounded-t-3xl outline outline-[#E2E2DC] bg-white">
<img
src='/images/logo.svg'
className='2xl:w-[5.972vw] w-[86px] cursor-pointer'
src="/images/logo.svg"
className="2xl:w-[5.972vw] w-[86px] cursor-pointer"
onClick={() => {
window.location.href = '/';
window.location.href = "/";
}}
alt='IRTH'
alt="IRTH"
/>
<p className='2xl:max-w-[17.083vw] text-s text-[#0D1922]/40 2xl:col-start-1 md:max-2xl:col-start-3 max-2xl:col-span-3 md:max-2xl:row-start-2 max-md:row-start-3 md:max-2xl:mt-[52px] max-md:mt-12'>
<p className="2xl:max-w-[17.083vw] text-s text-[#0D1922]/40 2xl:col-start-1 md:max-2xl:col-start-3 max-2xl:col-span-3 md:max-2xl:row-start-2 max-md:row-start-3 md:max-2xl:mt-[52px] max-md:mt-12">
For more information, visit
<br />
our website: 
<Link className='text-[#00BED7] underline' to={'https://www.irth.ae'}>
<Link className="text-[#00BED7] underline" to={"https://www.irth.ae"}>
www.irth.ae
</Link>
</p>
<div className='2xl:space-y-[0.833vw] space-y-3 md:max-2xl:col-start-3 max-2xl:col-span-3 md:max-2xl:row-start-3 max-md:row-start-4 max-md:mt-6'>
<p className='text-s text-[#0D1922]/40'>Follow us for more:</p>
<div className='flex 2xl:gap-[0.278vw] gap-1'>
<div className='2xl:p-[0.417vw] p-1.5 bg-[#E2E2DC] 2xl:rounded-[0.278vw] rounded'>
<div className='2xl:w-[2.222vw] 2xl:h-[2.222vw] md:max-2xl:w-8 md:max-2xl:h-8 w-9 h-9 text-[#0D1922]/70'>
<div className="2xl:space-y-[0.833vw] space-y-3 md:max-2xl:col-start-3 max-2xl:col-span-3 md:max-2xl:row-start-3 max-md:row-start-4 max-md:mt-6">
<p className="text-s text-[#0D1922]/40">Follow us for more:</p>
<div className="flex 2xl:gap-[0.278vw] gap-1">
<div className="2xl:p-[0.417vw] p-1.5 bg-[#E2E2DC] 2xl:rounded-[0.278vw] rounded">
<div className="2xl:w-[2.222vw] 2xl:h-[2.222vw] md:max-2xl:w-8 md:max-2xl:h-8 w-9 h-9 text-[#0D1922]/70">
<YoutubeIcon />
</div>
</div>
<div className='2xl:p-[0.417vw] p-1.5 bg-[#E2E2DC] 2xl:rounded-[0.278vw] rounded'>
<div className='2xl:w-[2.222vw] 2xl:h-[2.222vw] md:max-2xl:w-8 md:max-2xl:h-8 w-9 h-9 text-[#0D1922]/70'>
<div className="2xl:p-[0.417vw] p-1.5 bg-[#E2E2DC] 2xl:rounded-[0.278vw] rounded">
<div className="2xl:w-[2.222vw] 2xl:h-[2.222vw] md:max-2xl:w-8 md:max-2xl:h-8 w-9 h-9 text-[#0D1922]/70">
<InstagramIcon />
</div>
</div>
<div className='2xl:p-[0.417vw] p-1.5 bg-[#E2E2DC] 2xl:rounded-[0.278vw] rounded'>
<div className='2xl:w-[2.222vw] 2xl:h-[2.222vw] md:max-2xl:w-8 md:max-2xl:h-8 w-9 h-9 text-[#0D1922]/70'>
<div className="2xl:p-[0.417vw] p-1.5 bg-[#E2E2DC] 2xl:rounded-[0.278vw] rounded">
<div className="2xl:w-[2.222vw] 2xl:h-[2.222vw] md:max-2xl:w-8 md:max-2xl:h-8 w-9 h-9 text-[#0D1922]/70">
<FacebookIcon />
</div>
</div>
<div className='2xl:p-[0.417vw] p-1.5 bg-[#E2E2DC] 2xl:rounded-[0.278vw] rounded'>
<div className='2xl:w-[2.222vw] 2xl:h-[2.222vw] md:max-2xl:w-8 md:max-2xl:h-8 w-9 h-9 text-[#0D1922]/70'>
<div className="2xl:p-[0.417vw] p-1.5 bg-[#E2E2DC] 2xl:rounded-[0.278vw] rounded">
<div className="2xl:w-[2.222vw] 2xl:h-[2.222vw] md:max-2xl:w-8 md:max-2xl:h-8 w-9 h-9 text-[#0D1922]/70">
<LinkedInIcon />
</div>
</div>
<div className='2xl:p-[0.417vw] p-1.5 bg-[#E2E2DC] 2xl:rounded-[0.278vw] rounded'>
<div className='2xl:w-[2.222vw] 2xl:h-[2.222vw] md:max-2xl:w-8 md:max-2xl:h-8 w-9 h-9 text-[#0D1922]/70'>
<div className="2xl:p-[0.417vw] p-1.5 bg-[#E2E2DC] 2xl:rounded-[0.278vw] rounded">
<div className="2xl:w-[2.222vw] 2xl:h-[2.222vw] md:max-2xl:w-8 md:max-2xl:h-8 w-9 h-9 text-[#0D1922]/70">
<TwitterIcon />
</div>
</div>
</div>
</div>
<div className='2xl:border-l-[0.069vw] border-l border-[#E2E2DC] 2xl:pl-[1.111vw] pl-4 flex flex-col items-start 2xl:col-start-4 2xl:row-start-1 2xl:row-span-2 md:max-2xl:col-start-3 col-start-1'>
<div className="2xl:border-l-[0.069vw] border-l border-[#E2E2DC] 2xl:pl-[1.111vw] pl-4 flex flex-col items-start 2xl:col-start-4 2xl:row-start-1 2xl:row-span-2 md:max-2xl:col-start-3 col-start-1">
<Link
to={'/'}
className='text-btn-l flex-1 content-center md:my-4 my-[13px] text-[#0D1922]/70'
to={"/"}
className="text-btn-l flex-1 content-center md:my-4 my-[13px] text-[#0D1922]/70"
>
Map
</Link>
<Link
to={'/unit-types'}
className='text-btn-l flex-1 content-center md:my-4 my-[13px] text-[#0D1922]/70'
to={"/unit-types"}
className="text-btn-l flex-1 content-center md:my-4 my-[13px] text-[#0D1922]/70"
>
Unit Types
</Link>
<Link
to={'/about-irth'}
className='text-btn-l flex-1 content-center md:my-4 my-[13px] text-[#0D1922]/70'
to={"/about-irth"}
className="text-btn-l flex-1 content-center md:my-4 my-[13px] text-[#0D1922]/70"
>
About IRTH
</Link>
</div>
<div className='2xl:border-l-[0.069vw] border-l border-[#E2E2DC] 2xl:pl-[1.111vw] md:max-2xl:pl-6 pl-3.5 flex flex-col items-start 2xl:col-start-5 2xl:row-start-1 2xl:row-span-2'>
<div className="2xl:border-l-[0.069vw] border-l border-[#E2E2DC] 2xl:pl-[1.111vw] md:max-2xl:pl-6 pl-3.5 flex flex-col items-start 2xl:col-start-5 2xl:row-start-1 2xl:row-span-2">
<Link
to={'/favorites'}
className='text-btn-l flex-1 content-center md:my-4 my-[13px] text-[#0D1922]/70'
to={"/favorites"}
className="text-btn-l flex-1 content-center md:my-4 my-[13px] text-[#0D1922]/70"
>
Favorites
</Link>
<Link
to={'/search'}
className='text-btn-l flex-1 content-center md:my-4 my-2.5 text-[#0D1922]/70'
to={"/search"}
className="text-btn-l flex-1 content-center md:my-4 my-[13px] text-[#0D1922]/70"
>
Search
</Link>
<button className='text-btn-l flex-1 content-center md:my-3 text-[#0D1922]/70 flex items-center gap-2'>
<button className="text-btn-l flex-1 content-center md:my-3 my-[13px] text-[#0D1922]/70 flex items-center gap-2">
<span>Brochures</span>
<div className='2xl:w-[1.667vw] 2xl:h-[1.667vw] md:max-2xl:w-6 md:max-2xl:h-6 w-5 h-5'>
<div className="2xl:w-[1.667vw] 2xl:h-[1.667vw] md:max-2xl:w-6 md:max-2xl:h-6 w-5 h-5">
<ChevronDownIcon />
</div>
</button>
</div>
<div className='content-end 2xl:text-right 2xl:col-start-6 2xl:row-start-1 2xl:row-span-2 md:max-2xl:col-start-1 md:max-2xl:row-start-3 max-md:col-span-3 max-md:pt-3 max-md:border-t border-[#E2E2DC]'>
<div className="content-end 2xl:text-right 2xl:col-start-6 2xl:row-start-1 2xl:row-span-2 md:max-2xl:col-start-1 md:max-2xl:row-start-3 max-md:col-span-3 max-md:pt-3 max-md:border-t border-[#E2E2DC]">
<Link
to={'/'}
className='md:text-caption-m text-caption-s max-2xl:text-[#73787C] text-[#0D1922]/70'
to={"/"}
className="md:text-caption-m text-caption-s max-2xl:text-[#73787C] text-[#0D1922]/70"
>
Privacy Policy
</Link>
src/components/Header.tsx
+1 -1
View File
@@ -67,7 +67,7 @@ function Header() {
ref={burgerRef}
onlyIcon
variant="secondary"
className="2xl:hidden !outline !outline-[#E2E2DC] md:mr-6 mr-4"
className="2xl:hidden !bg-[#F3F3F2] md:mr-6 mr-4"
onClick={(e) => {
e.stopPropagation();
if (modal) setModal(null);
src/components/ProjectSelect.tsx
+4 -1
View File
@@ -67,7 +67,10 @@ function ProjectSelect<T extends boolean = false>({
))}
</div>
<Select
options={["All", ...projects.map((project) => project.title)]}
options={[
...(withAll ? ["All"] : []),
...projects.map((project) => project.title),
]}
onSelect={(option) =>
setSelectedProject(
projects.find((project) => project.title === option) ||
src/components/SearchFilters.tsx
+4 -8
View File
@@ -388,6 +388,7 @@ function SearchFilters({
prev.delete("unitTypes");
return prev;
});
if (inModal) setInModal(false);
}
function applyFilters() {
@@ -644,19 +645,14 @@ function SearchFilters({
onlyIcon={!inModal && innerWidth < 768}
onClick={resetFilters}
className={clsx(
!inModal && "max-md:bg-[#F3F3F2]",
"max-md:!transition-none"
!inModal ? "max-md:bg-[#F3F3F2]" : "max-md:w-full",
"max-md:!transition-none justify-center"
)}
>
<span className="2xl:w-[1.389vw] 2xl:h-[1.389vw] w-5 h-5 text-[#0D1922]/70">
<RestartIcon />
</span>
<p
className={clsx(
"text-s max-md:w-full",
!inModal && "max-md:hidden"
)}
>
<p className={clsx("text-s", !inModal && "max-md:hidden")}>
Reset filters
</p>
</Button>
src/components/icons/RestartIcon.tsx
+1 -1
View File
@@ -4,7 +4,7 @@ function RestartIcon() {
<path
fillRule="evenodd"
clipRule="evenodd"
d="m14.26 3.583.95-.557a.75.75 0 0 0-.758-1.294L11.848 3.26a1 1 0 0 0-.33 1.413l1.53 2.32a.75.75 0 0 0 1.252-.826l-.806-1.224c3.288.687 5.756 3.596 5.756 7.078 0 3.991-3.244 7.23-7.25 7.23s-7.25-3.239-7.25-7.23a7.2 7.2 0 0 1 1.838-4.812c.276-.309.302-.78.023-1.087s-.755-.331-1.037-.027A8.7 8.7 0 0 0 3.25 12.02c0 4.823 3.92 8.73 8.75 8.73s8.75-3.907 8.75-8.73c0-4.044-2.753-7.443-6.49-8.437"
d="m14.26 3.583.95-.557a.75.75 0 0 0-.758-1.294L11.848 3.26a1 1 0 0 0-.33 1.413l1.53 2.32a.75.75 0 0 0 1.252-.826l-.806-1.223c3.288.686 5.756 3.595 5.756 7.077 0 3.991-3.244 7.23-7.25 7.23s-7.25-3.239-7.25-7.23a7.2 7.2 0 0 1 1.838-4.812c.276-.309.302-.78.023-1.087s-.755-.331-1.037-.027A8.7 8.7 0 0 0 3.25 12.02c0 4.823 3.92 8.73 8.75 8.73s8.75-3.907 8.75-8.73c0-4.043-2.753-7.443-6.49-8.437"
fill="currentColor"
/>
</svg>
src/components/icons/SquaresIcon.tsx
+13
View File
@@ -0,0 +1,13 @@
function SquaresIcon() {
return (
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M10 13.75H5a.25.25 0 0 0-.25.25v5c0 .138.112.25.25.25h5a.25.25 0 0 0 .25-.25v-5l-.005-.05a.25.25 0 0 0-.245-.2Zm9 0h-5a.25.25 0 0 0-.25.25v5c0 .138.112.25.25.25h5a.25.25 0 0 0 .25-.25v-5l-.005-.05a.25.25 0 0 0-.245-.2Zm0-9h-5a.25.25 0 0 0-.25.25v5c0 .138.112.25.25.25h5a.25.25 0 0 0 .25-.25V5l-.005-.05a.25.25 0 0 0-.245-.2Zm-9 0H5a.25.25 0 0 0-.25.25v5c0 .138.112.25.25.25h5a.25.25 0 0 0 .25-.25V5l-.005-.05a.25.25 0 0 0-.245-.2Z"
stroke="currentColor"
strokeLinecap="round"
/>
</svg>
);
}
export default SquaresIcon;