Skip to content

๐Ÿ› fix: Post ์ปดํฌ๋„ŒํŠธ className Props ์ถ”๊ฐ€ ๋ฐ ๊ณ ์ • width ์ˆ˜์ • #126

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. Weโ€™ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
minimo-9 merged 2 commits into from
Jun 20, 2025
Merged

๐Ÿ› fix: Post ์ปดํฌ๋„ŒํŠธ className Props ์ถ”๊ฐ€ ๋ฐ ๊ณ ์ • width ์ˆ˜์ • #126

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8958afa
๐Ÿ› fix: Post ์ปดํฌ๋„ŒํŠธ์— className prop ์ถ”๊ฐ€ ๊ณ ์ • width ์ˆ˜์ •
minimo-9 Jun 20, 2025
75238ad
๐Ÿ› fix: Post ์ปดํฌ๋„ŒํŠธ์—์„œ className prop ์ œ๊ฑฐ ๋ฐ ๊ด€๋ จ ์Šคํƒ€์ผ ์ˆ˜์ •
minimo-9 Jun 20, 2025
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
17 changes: 10 additions & 7 deletions src/components/common/Post.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,11 @@
import PostImg from '@/assets/images/post-default.png';
import type { NoticeShopItem } from '@/api/noticeApi';

interface PostProps {
data: NoticeShopItem;
className?: string;
}

// ์ƒํƒœ ๊ณ„์‚ฐ
function getStatus(
startsAt: string,
Expand All @@ -24,7 +29,7 @@
return 'ACTIVE';
}

export default function Post({ data }: { data: NoticeShopItem }) {
export default function Post({ data, className = '' }: PostProps) {

Check failure on line 32 in src/components/common/Post.tsx

View workflow job for this annotation

GitHub Actions / build-test 

'className' is declared but its value is never read.
const {
hourlyPay,
workhour,
Expand Down Expand Up @@ -80,7 +85,7 @@
}

return (
<div className="flex h-261 w-171 cursor-pointer flex-col gap-12 rounded-xl border border-gray-20 bg-white p-12 md:h-359 md:w-332 md:gap-20 md:p-16 lg:h-348 lg:w-312">
<div className="flex h-261 w-full cursor-pointer flex-col gap-12 rounded-xl border border-gray-20 bg-white p-12 md:h-359 md:gap-20 md:p-16 lg:h-348">
<div className="relative">
<div
className="relative h-84 w-full rounded-xl bg-cover bg-center md:h-171 lg:h-160"
Expand Down Expand Up @@ -127,18 +132,16 @@
className="flex flex-col justify-between md:flex-row md:items-center"
title={`${hourlyPay.toLocaleString()}์›${isHigherPay ? `: ๊ธฐ์กด ์‹œ๊ธ‰๋ณด๋‹ค ${percent}%` : ''}`}
>
<div className="truncate text-lg/23 font-bold md:text-h2/29 lg:max-w-110">
<div className="w-full truncate text-lg/23 font-bold md:text-h2/29">
{hourlyPay.toLocaleString()}์›
</div>
{isHigherPay && (
<>
{/*๋ฐ์Šคํฌํƒ‘, ํƒœ๋ธ”๋ฆฟ*/}
<div
className={`hidden h-36 max-w-168 items-center justify-center gap-2 rounded-[20px] p-12 text-body2 font-bold text-white md:flex ${badgeBgColor}`}
className={`hidden h-36 w-full items-center justify-center gap-2 rounded-[20px] p-12 text-body2 font-bold text-white md:flex ${badgeBgColor}`}
>
Copy link
Contributor

@Moon-ju-young Moon-ju-young Jun 20, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

โ“ ์•„๋งˆ ๊ฐ€๊ฒฉ ํ‘œ์‹œ ๋ถ€๋ถ„์ธ ๊ฒƒ ๊ฐ™์€๋ฐ ์—ฌ๊ธฐ์„œ w-full์„ ์“ฐ๋ฉด ์Šคํƒ€์ผ์ด ์•ˆ ๊นจ์ง€๋‚˜์š”?

Copy link
Collaborator Author

@minimo-9 minimo-9 Jun 20, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

์—‡ ๊ทธ๋ƒฅ ๋‹ค ๋ฐ”๊ฟ”๋ฒ„๋ ค์„œ ์ด๊ฑฐ ์ „์ฒด ๋ถ€๋ถ„ ์ ์šฉํ•˜๊ณ  ๋ฐ”๊พธ๊ฒ ์Šต๋‹ˆ๋‹ค ใ…‹ใ…‹ใ…‹

<div className="max-w-168 truncate">
๊ธฐ์กด ์‹œ๊ธ‰๋ณด๋‹ค {percent}%
</div>
<div className="w-full truncate">๊ธฐ์กด ์‹œ๊ธ‰๋ณด๋‹ค {percent}%</div>
<img src={ArrowUpWhite} alt="์œ„ ํ™”์‚ดํ‘œ" className="h-20 w-20" />
</div>
{/*๋ชจ๋ฐ”์ผ*/}
Expand Down
Loading