Skip to content

style: 상단 카드 제거 #55

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
FlashingFuture merged 1 commit into from
Sep 22, 2025
Merged

style: 상단 카드 제거 #55

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
12 changes: 5 additions & 7 deletions apps/web/src/pages/Home/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,13 +11,11 @@ export default function Home() {
<Wrap>
<StarsCanvas ref={canvasRef} />
<Glow />
<Card>
<Title>Runova</Title>
<Desc>
도시 위에 <b>GPS 아트</b>를 새기는 러닝 앱. 달려서 나만의 별자리
지도를 완성해 보세요.
</Desc>
</Card>
<Title>Runova</Title>
<Desc>
도시 위에 <b>GPS 아트</b>를 새기는 러닝 앱. 달려서 나만의 별자리 지도를
완성해 보세요.
</Desc>
Comment on lines +14 to +18

@gemini-code-assist gemini-code-assist Bot Sep 22, 2025

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

medium

Card 컴포넌트가 제거되면서 Title과 Desc가 Wrap의 직접적인 자식 요소가 되었습니다. Wrap은 place-items: center로 아이템을 중앙 정렬하는데, Desc 컴포넌트에 margin-right: 10px와 같은 '매직 넘버'가 포함된 margin이 설정되어 있어 완벽한 중앙 정렬이 되지 않을 수 있습니다.1

또한, Wrap의 gap과 각 컴포넌트의 margin이 중첩되어 수직 간격이 의도와 다르게 표시될 수 있습니다.

레이아웃의 일관성을 위해 Title과 Desc 컴포넌트의 margin 속성을 제거하거나 theme/constants 값으로 조정한 후, 간격은 부모인 Wrap의 gap으로만 관리하는 것을 고려해 보시는 것이 좋겠습니다.

Style Guide References

Footnotes

  1. 스타일 가이드에 따라, 10px와 같은 매직 넘버는 이름 있는 상수로 관리하여 코드의 일관성과 유지보수성을 높여야 합니다. 현재 Desc 컴포넌트의 margin에 하드코딩된 값이 사용되어 레이아웃 문제를 유발할 수 있습니다. (link) ↩

<Card>
<Title as="h2">다운로드 링크</Title>
<List>
Expand Down