-
Notifications
You must be signed in to change notification settings - Fork 1
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.
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
feat(profile): complete profile box UI #421
Changes from 1 commit
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -5,17 +5,7 @@ import { LogoIcon } from "@biseo/web/assets"; | |
import { Box } from "@biseo/web/components/atoms"; | ||
import { HeaderItem, Profile } from "@biseo/web/components/molecules"; | ||
import { useAuth } from "@biseo/web/services/auth"; | ||
import { | ||
bg, | ||
center, | ||
h, | ||
w, | ||
round, | ||
text, | ||
justify, | ||
align, | ||
column, | ||
} from "@biseo/web/styles"; | ||
import { bg, center, h, w, round, text } from "@biseo/web/styles"; | ||
|
||
const adminPathList = [ | ||
{ name: "유저 모드", path: "" }, | ||
|
@@ -70,7 +60,7 @@ export const Header: React.FC = () => { | |
: null} | ||
</Box> | ||
<div | ||
css={[column, justify.start, align.center, h(32)]} | ||
css={[{ position: "relative" }]} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 여기 {[{...}]}으로 묶는 방법 말고 조금 더 깔끔하게 작성할 수 있는 방법이 있나요? There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 대괄호 생략하고 그냥 쌍중괄호 쓰기...? 아이템이 하나면 대괄호 생략 가능해용 There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 아 style={{...}}는 해봣믄데 css={{...}}는 안해봐서 모르겟군 되지 않ㅎ을까 둘다 inline css니까...?? There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 넹 돼요 |
||
onMouseEnter={() => setHover(true)} | ||
onMouseLeave={() => setHover(false)} | ||
> | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
gap, margin, 또는 padding으로 5px을 띄우면 해당 간격을 마우스가 지날 때 setHover(false)가 되는 바람에 투명 div를 만들었습니다
뭔가 하드코딩 느낌이라 바꾸고 싶은데 방법을 모르겠어요..
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Atom 컴포넌트로 spacer 컴포넌트를 만들어서 이용하는 것도 하나의 방법일 것 같아요
https://seya01.medium.com/how-to-style-margin-with-react-d250d512d0a0