Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions src/features/home/ui/components/homeFullSheet.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,15 +30,15 @@ export const HomeSheet = () => {
{open && (
<>
<motion.div
className="pointer-events-auto absolute inset-0 z-40 bg-black/40"
className="pointer-events-auto absolute inset-0 bg-black/40"
onClick={replaceRouter}
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}
/>

<motion.div
className="pointer-events-auto absolute bottom-0 left-0 right-0 z-50 flex h-[55vh] flex-col rounded-t-2xl bg-white p-5 shadow-xl"
className="pointer-events-auto absolute bottom-0 left-0 right-0 flex h-[55vh] flex-col rounded-t-2xl bg-white p-5 shadow-xl"
initial={{ y: "100%" }}
animate={{ y: 0 }}
exit={{ y: "100%" }}
Expand All @@ -56,7 +56,7 @@ export const HomeSheet = () => {
animate={{ x: 0, opacity: 1 }}
exit={{ x: -100, opacity: 0 }}
transition={{ duration: 0.5, ease: "easeInOut" }}
className="flex h-full flex-col justify-between"
className="z-11 flex h-full flex-col justify-between"
>
{mode?.key === "pinpoints" && <PinpointRowBox />}
{mode?.key === "maxTime" && <MaxTimeSliderBox />}
Expand Down
2 changes: 1 addition & 1 deletion src/features/home/ui/homeUrgentNoticeList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ export const UrgentNoticeList = () => {
</p>
</div>
<div
className="min-w-auto flex items-center text-xs font-semibold text-greyscale-grey-400"
className="min-w-auto hover: flex items-center text-xs font-semibold text-greyscale-grey-400 hover:cursor-pointer"
onClick={pageRouter}
>
<span>전체보기</span>
Expand Down
13 changes: 7 additions & 6 deletions src/features/listings/hooks/listingsHooks.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -37,9 +37,9 @@ const normalizeRentType = (rentType: string) => {
};

export const getListingIcon = (type: string, housingType: string, size = 78) => {
const Nyear = normalizeRentType(type);
const Near = normalizeRentType(type);

const IconComp = LISTING_ICON_MAP[Nyear]?.[housingType];
const IconComp = LISTING_ICON_MAP[Near]?.[housingType];
if (!IconComp) return null;

return <IconComp width={size} height={size} />;
Expand Down Expand Up @@ -160,14 +160,15 @@ export const HouseICons = (item: ListingNormalized) => {
type HouseRentalProps = ListingNormalized & {
query: "listingListInfinite" | "listingSearchInfinite" | "notice";
};
// ListingNormalized

// ListingNormalized
export const HouseRental = ({ query, ...item }: HouseRentalProps) => {
const rantalText = getListingsRental(item.type);
if (!rantalText) return null;
const Near = normalizeRentType(item.type);
const rentalText = getListingsRental(Near);
if (!rentalText) return null;
return (
<span className="flex w-full justify-between">
<ListingBgBookMark item={item.type} bg={rantalText.bg} text={rantalText.text} border="none" />
<ListingBgBookMark item={item.type} bg={rentalText.bg} text={rentalText.text} border="none" />
<LikeType liked={item.liked} id={item.id} type={"NOTICE"} resetQuery={[query]} />
</span>
);
Expand Down
17 changes: 15 additions & 2 deletions src/features/listings/ui/listingsContents/listingsBookMark.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,26 @@ export const ListingBookMark = ({ item, border }: { item: string; border: string
aria-label="Toggle bookmark"
size="sm"
variant="outline"
className={`data-[state=on]:*:[svg]:fill-blue-500 data-[state=on]:*:[svg]:stroke-blue-500 ${border}`}
className={` ${border} data-[state=on]:*:[svg]:fill-blue-500 data-[state=on]:*:[svg]:stroke-blue-500 max-w-full overflow-hidden rounded-[4px]`}
>
<p className="text-xs">{item}</p>
<p className="min-w-0 flex-1 truncate text-xs-12">{item}</p>
</Toggle>
);
};

// export const ListingBookMark = ({ item, border }: { item: string; border: string }) => {
// return (
// <Toggle
// aria-label="Toggle bookmark"
// size="sm"
// variant="outline"
// className={` ${border} data-[state=on]:*:[svg]:fill-blue-500 data-[state=on]:*:[svg]:stroke-blue-500 inline-flex w-fit max-w-none rounded-[4px]`}
// >
// <p className="whitespace-nowrap text-xs-12">{item}</p>
// </Toggle>
// );
// };

export const ListingBgBookMark = ({
item,
bg,
Expand Down
21 changes: 9 additions & 12 deletions src/features/listings/ui/listingsContents/listingsContentCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,9 +27,9 @@ export const ListingContentsCard = <T extends ListingUnion>({ data }: { data: T[
onClick={() => handleRouter(normalized.id)}
>
<div className="border-r-1 flex w-[35%] flex-col rounded-l-xl rounded-bl-xl bg-bgColor-mute pl-1 pt-2">
<div className="flex justify-start gap-1">
<div className="flex min-w-0 items-center gap-2">
<ListingBookMark item={normalized.type} border="border" />
<p className="truncate text-xs font-semibold text-greyscale-grey-800">
<p className="min-w-0 flex-1 truncate text-xs font-semibold text-greyscale-grey-800">
{normalized.supplier}
</p>
</div>
Expand All @@ -38,26 +38,23 @@ export const ListingContentsCard = <T extends ListingUnion>({ data }: { data: T[
</div>
</div>

<div className="flex w-[65%] flex-col justify-start gap-2 rounded-br-xl rounded-tr-xl bg-white pb-3 pl-4 pr-4 pt-2">
<div
className="flex items-baseline gap-2"
onClick={e => {
e.stopPropagation();
}}
>
<div className="flex w-[65%] flex-col gap-2 rounded-br-xl rounded-tr-xl bg-white py-3 pl-4 pr-[10px]">
<div onClick={e => e.stopPropagation()}>
<HouseRental
{...normalized}
query={path ? "listingSearchInfinite" : "listingListInfinite"}
/>
</div>

<div className="max-w-full">
<p className="truncate text-sm font-semibold">
<p className="truncate text-sm font-semibold leading-tight">
<HighlightCenteredText text={normalized.name} keyword={keyword} />
</p>
</div>

<div className="max-w-full">
<p className="text-sm text-greyscale-grey-400">모집일정</p>
<p className="text-sm text-greyscale-grey-400">
<p className="text-sm leading-tight text-greyscale-grey-400">모집일정</p>
<p className="text-sm leading-tight text-greyscale-grey-400">
{formatApplyPeriod(normalized.applyPeriod)}
</p>
</div>
Expand Down
10 changes: 7 additions & 3 deletions src/features/listings/ui/listingsFullSheet/listingsFullSheet.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -253,7 +253,7 @@ const FilterSheetContainer = ({
exit={{ opacity: 0 }}
/>
<motion.div
className="pointer-events-auto absolute bottom-0 left-0 right-0 z-50 flex h-[85vh] flex-col rounded-t-2xl bg-white shadow-xl"
className="pointer-events-auto absolute bottom-0 left-0 right-0 z-50 flex h-[85%] max-h-full flex-col rounded-t-2xl bg-white shadow-xl"
initial={{ y: "100%" }}
animate={{ y: 0 }}
exit={{ y: "100%" }}
Expand All @@ -278,9 +278,13 @@ const FilterSheetHeader = ({ onClose }: { onClose: () => void }) => {
<>
<div className="mx-auto mb-3 mt-2 h-1.5 w-12 rounded-full bg-gray-300" />

<div className="flex items-center justify-between px-5 pb-2">
<div className="flex items-center justify-between px-5 pb-2 pt-1">
<h2 className="text-sm font-bold">공고 필터</h2>
<button onClick={onClose} className="text-xl font-bold">
<button
onClick={onClose}
className="-mr-2 inline-flex h-10 w-10 items-center justify-center rounded-full"
aria-label="close filter sheet"
>
<CloseButton />
</button>
</div>
Expand Down
2 changes: 1 addition & 1 deletion src/shared/ui/globalRender/mobileFrameWithSheetPortal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ export function MobileFrameWithSheetPortal({

<div
id="mobile-overlay-root"
className="pointer-events-none absolute inset-0 z-0 overflow-hidden sm:rounded-xl md:rounded-2xl lg:rounded-2xl"
className="pointer-events-none absolute inset-0 z-20 overflow-hidden sm:rounded-xl md:rounded-2xl lg:rounded-2xl"
/>

{/* 바텀시트가 이 컨테이너에만 렌더되도록 포탈 타깃 */}
Expand Down