[강희정] sprint2 #136
[강희정] sprint2 #136
Conversation
dongqui
left a comment
dongqui
left a comment
There was a problem hiding this comment.
오.. 빠르고 깔끔하게 진행해 주셨네요! 😮 👍 👍
html, css가 상당히 능숙하신 거 같습니다!
일부 불필요한 스타일이나 작은 실수만 신경 써주시면 될 거 같아요 :)
| <p class="info-card-label text-2lg-bold">Hot item</p> | ||
| <h2 class="info-card-title">인기 상품을<br />확인해 보세요</h2> | ||
| <span class="info-card-label text-2lg-bold">Hot item</span> | ||
| <h1 class="info-card-title">인기 상품을<br />확인해 보세요</h1> |
There was a problem hiding this comment.
h tag가 계층 구조여야 한다고 말씀드렸던 부분은, 요런 느낌입니다 :)
h1은 페이지에서 하나만 있어야 합니다~!
단순 시각화용이거나 의미적으로 좀 애매하다 싶으면 그냥 span을 쓰셔도 괜찮아요~! 🤣
There was a problem hiding this comment.
접근성 개념이 약간 애매할 수 있는데,
https://youtu.be/50HYtOTMhe0?si=SJJb0x0U59jOCcEZ&t=41
영상 보시면 스크린 리더기를 활용해서 heading level 1 -> 2 -> 3 순으로 읽어 나가며 원하는 정보를 찾는 것을 확인하실 수 있어요!
| <!-- 로그인 폼 --> | ||
| <form class="login-form"> | ||
| <div class="form-group"> | ||
| <label for="email" class="text-2lg-bold">이메일</label> |
There was a problem hiding this comment.
텍스트 스타일 클래스를 잘 정의해 주셔서 깔끔하게 적용되네요 🤣
| <label for="password" class="text-2lg-bold">비밀번호</label> | ||
| <div class="password-wrapper"> | ||
| <input type="password" id="password" class="text-lg-regular" /> | ||
| <button type="button" class="btn-toggle-password"> |
| @@ -0,0 +1,165 @@ | |||
| /* login.css */ | |||
There was a problem hiding this comment.
UI가 대부분 비슷해서 하나의 스타일 파일로 관리하거나, 공통 부분을 뽑아내는 것이 좋습니다 :) 지금은 관리 포인트가 두 곳이 됐죠!
| @@ -0,0 +1,165 @@ | |||
| /* login.css */ | |||
| * { | |||
There was a problem hiding this comment.
요것도 공통 스타일에서 관리하시는 것이 편하겠네요! :)
| .login-page { | ||
| display: flex; | ||
| width: 100%; | ||
| max-width: 1920px; |
| } | ||
|
|
||
| .login-logo { | ||
| display: flex; |
| line-height: normal; | ||
| text-decoration-line: underline; | ||
| text-decoration-style: solid; | ||
| text-decoration-skip-ink: none; |
There was a problem hiding this comment.
신기한 게 많군요..! text-underline-position 말고는 기본으로 다 들어가 있는 값들 같습니다 🤣
2 participants
요구사항
기본
공통
로그인 페이지
회원가입 페이지
심화
주요 변경사항
스크린샷
멘토에게