This commit is contained in:
2024-05-06 18:35:48 +05:00
parent f76ff7d516
commit 27bc23930e
4 changed files with 339 additions and 184 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 6.5 MiB

+11 -10
View File
@@ -12,7 +12,6 @@ import useFullScreen from "../../store/useFullScreen";
import ActiveResizeIcon from "../icons/ActiveResizeIcon";
const ComplexTopPanel = () => {
// const [isFullMode, setIsFullMode] = useState(false);
const { setModal } = useModal();
const { onFullscreen, isFullscreen, setIsFullscreen } = useFullScreen();
const navigate = useNavigate();
@@ -48,7 +47,7 @@ const ComplexTopPanel = () => {
<div
className={`absolute top-[62px] left-0 z-20 w-full p-4 grid grid-cols-12 select-none touch-none pointer-events-none`}
>
<div className="flex gap-2 col-span-3">
<div className="flex gap-2 col-span-5">
<Button
icon={<LeftArrowSliderIcon />}
buttonType="cta"
@@ -66,15 +65,17 @@ const ComplexTopPanel = () => {
text="About Complex"
/>
</div>
<div className="flex flex-col col-start-6 col-span-2 text-white text-center">
<h2 className="font-semibold text-subheadline-s drop-shadow drop-shadow-[0_2px_8px_0px_rgba(62, 84, 100, 0.25)]">
ROVE Home Marasi Drive
</h2>
<p className="text-s drop-shadow drop-shadow-[0_2px_8px_0px_rgba(62, 84, 100, 0.25)]">
Select a wing
</p>
<div className="flex flex-col col-start-6 col-span-4 text-white text-center items-start">
<div className="text-center ">
<h2 className="font-semibold text-subheadline-s drop-shadow drop-shadow-[0_2px_8px_0px_rgba(62, 84, 100, 0.25)]">
ROVE Home Marasi Drive
</h2>
<p className="text-s drop-shadow drop-shadow-[0_2px_8px_0px_rgba(62, 84, 100, 0.25)]">
Select a wing
</p>
</div>
</div>
<div className="flex gap-2 col-span-2 col-start-11 justify-end">
<div className="flex gap-2 col-span-1 col-start-12 justify-end">
{isFullscreen ? (
<Button
buttonType="fab"
File diff suppressed because one or more lines are too long
@@ -1,6 +1,6 @@
const WingDescription = () => {
return (
<div className="bg-white rounded-lg absolute left-1/2 top-1/2 z-50 p-6 flex flex-col gap-4">
<div className="bg-white rounded-lg p-6 flex flex-col gap-4 w-[364px]">
<div className="relative">
<div className="flex justify-between border-b pb-4">
<p className="text-[#0D1922] font-semibold text-[20px]">East Wing</p>
@@ -8,21 +8,19 @@ const WingDescription = () => {
234 units
</div>
</div>
<div className="flex flex-col gap-4">
<div className="flex flex-col gap-4 pt-4">
<div className="flex items-center justify-between gap-8">
<div className="flex gap-2 items-center">
<div className="w-6 h-6 rounded-full bg-[#00BED7] text-white text-xs font-semibold">
<p className="h-full w-full flex justify-center items-center">
21
</p>
<div className="min-w-6 min-h-6 rounded-full bg-[#00BED7] text-white text-xs font-semibold">
<p className="p-1 flex justify-center items-center">21</p>
</div>
<p className="text-s text-[#73787C]">Studio Flex</p>
<p className="text-s text-[#73787C] w-full">Studio Flex</p>
</div>
<p className="text-s text-[#0D1922]">AED 1,048,888</p>
</div>
<div className="flex items-center justify-between gap-8">
<div className="flex gap-2 items-center">
<div className="w-6 h-6 rounded-full bg-[#00BED7] text-white text-xs font-semibold">
<div className="min-w-6 min-h-6 p-1 rounded-full bg-[#00BED7] text-white text-xs font-semibold">
<p className="h-full w-full flex justify-center items-center">
56
</p>
@@ -33,7 +31,7 @@ const WingDescription = () => {
</div>
<div className="flex items-center justify-between gap-8">
<div className="flex gap-2 items-center">
<div className="w-6 h-6 rounded-full bg-[#00BED7] text-white text-xs font-semibold">
<div className="min-w-6 min-h-6 p-1 rounded-full bg-[#00BED7] text-white text-xs font-semibold">
<p className="h-full w-full flex justify-center items-center">
89
</p>
@@ -44,7 +42,7 @@ const WingDescription = () => {
</div>
<div className="flex items-center justify-between gap-8">
<div className="flex gap-2 items-center">
<div className="w-6 h-6 rounded-full bg-[#00BED7] text-white text-xs font-semibold">
<div className="min-w-6 min-h-6 p-1 rounded-full bg-[#00BED7] text-white text-xs font-semibold">
<p className="h-full w-full flex justify-center items-center">
10
</p>
@@ -54,7 +52,7 @@ const WingDescription = () => {
<p className="text-s text-[#0D1922]">AED 2,408,888</p>
</div>
</div>
<div className="w-0 h-0 border-t-0 border-r-[7px] border-b-[12px] border-l-[7px] border-transparent border-b-white rotate-90 absolute top-0 -right-[37px]"></div>
<div className="w-0 h-0 border-t-0 border-r-[7px] border-b-[12px] border-l-[7px] border-transparent border-b-white rotate-90 absolute top-0 -right-[35px]"></div>
</div>
</div>
);