-
Notifications
You must be signed in to change notification settings - Fork 44
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
[김보민] Week2 #58
The head ref may contain hidden characters: "part1-\uAE40\uBCF4\uBBFC-week2"
[김보민] Week2 #58
Changes from all commits
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 |
---|---|---|
@@ -0,0 +1,48 @@ | ||
/* http://meyerweb.com/eric/tools/css/reset/ | ||
v2.0 | 20110126 | ||
License: none (public domain) | ||
*/ | ||
|
||
html, body, div, span, applet, object, iframe, | ||
h1, h2, h3, h4, h5, h6, p, blockquote, pre, | ||
a, abbr, acronym, address, big, cite, code, | ||
del, dfn, em, img, ins, kbd, q, s, samp, | ||
small, strike, strong, sub, sup, tt, var, | ||
b, u, i, center, | ||
dl, dt, dd, ol, ul, li, | ||
fieldset, form, label, legend, | ||
table, caption, tbody, tfoot, thead, tr, th, td, | ||
article, aside, canvas, details, embed, | ||
figure, figcaption, footer, header, hgroup, | ||
menu, nav, output, ruby, section, summary, | ||
time, mark, audio, video { | ||
margin: 0; | ||
padding: 0; | ||
border: 0; | ||
font-size: 100%; | ||
font: inherit; | ||
vertical-align: baseline; | ||
} | ||
/* HTML5 display-role reset for older browsers */ | ||
article, aside, details, figcaption, figure, | ||
footer, header, hgroup, menu, nav, section { | ||
display: block; | ||
} | ||
body { | ||
line-height: 1; | ||
} | ||
ol, ul { | ||
list-style: none; | ||
} | ||
blockquote, q { | ||
quotes: none; | ||
} | ||
blockquote:before, blockquote:after, | ||
q:before, q:after { | ||
content: ''; | ||
content: none; | ||
} | ||
table { | ||
border-collapse: collapse; | ||
border-spacing: 0; | ||
} | ||
Original file line number | Diff line number | Diff line change | ||||
---|---|---|---|---|---|---|
@@ -0,0 +1,164 @@ | ||||||
@import "reset.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. 오 @import 잘 활용하셨네요 👍🏽 |
||||||
|
||||||
* { | ||||||
box-sizing: border-box; | ||||||
} | ||||||
|
||||||
|
||||||
Comment on lines
+6
to
+7
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. 클래스 사이에 빈 줄은 1줄만 띄어주세요 |
||||||
html{ | ||||||
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. 태그, 클래스와 중괄호 사이에 1칸 띄어쓰기 해주세요!
Suggested change
|
||||||
height:100%; | ||||||
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. 속성의 키와 값 사이에도 1칸 띄어쓰기 해주세요!
Suggested change
|
||||||
} | ||||||
|
||||||
body{ | ||||||
position:relative; | ||||||
width:100%; | ||||||
height:100%; | ||||||
display: flex; | ||||||
align-items: center; | ||||||
justify-content: center; | ||||||
flex-direction: column; | ||||||
} | ||||||
|
||||||
.contents{ | ||||||
display: flex; | ||||||
flex-direction: column; | ||||||
gap:30px; | ||||||
} | ||||||
|
||||||
.title{ | ||||||
display: flex; | ||||||
flex-direction: column; | ||||||
align-items: center; | ||||||
} | ||||||
|
||||||
.logo{ | ||||||
height: 38px; | ||||||
} | ||||||
|
||||||
h2{ | ||||||
color: black; | ||||||
font-size: 16px; | ||||||
font-family: Pretendard; | ||||||
font-weight: 400; | ||||||
line-height: 24px; | ||||||
} | ||||||
|
||||||
h2 a{ | ||||||
color: #6D6AFE; | ||||||
font-size: 16px; | ||||||
font-family: Pretendard; | ||||||
font-weight: 600; | ||||||
} | ||||||
|
||||||
h3{ | ||||||
color: black; | ||||||
font-size: 14px; | ||||||
font-family: Pretendard; | ||||||
font-weight: 400; | ||||||
margin-bottom: 12px; | ||||||
} | ||||||
|
||||||
.input-form{ | ||||||
display: flex; | ||||||
gap:24px; | ||||||
flex-direction: column; | ||||||
} | ||||||
|
||||||
input{ | ||||||
width: 400px; | ||||||
padding: 18px 15px; | ||||||
border-radius: 8px; | ||||||
border: 1px #CCD5E3 solid; | ||||||
justify-content: center; | ||||||
align-items: center; | ||||||
color: #373740; | ||||||
font-size: 16px; | ||||||
font-family: Pretendard; | ||||||
font-weight: 400; | ||||||
line-height: 24px; | ||||||
} | ||||||
|
||||||
input:focus { | ||||||
outline: 1px #6D6AFE solid; | ||||||
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. border 로 처리하시면 됩니다! |
||||||
} | ||||||
|
||||||
|
||||||
button{ | ||||||
width: 100%; | ||||||
padding: 16px 20px; | ||||||
background: linear-gradient(91deg, #6D6AFE 0%, #6AE3FE 100%); | ||||||
border-radius: 8px; | ||||||
border: none; | ||||||
color: #F5F5F5; | ||||||
font-size: 18px; | ||||||
font-family: Pretendard; | ||||||
font-weight: 600; | ||||||
} | ||||||
|
||||||
.social-login{ | ||||||
display: flex; | ||||||
width: 100%; | ||||||
align-items: center; | ||||||
justify-content: space-between; | ||||||
padding: 12px 24px; | ||||||
background-color: #E7EFFB; | ||||||
border-radius: 8px; | ||||||
border: 1px #CCD5E3 solid; | ||||||
} | ||||||
|
||||||
.social-icon{ | ||||||
display: flex; | ||||||
gap: 16px | ||||||
} | ||||||
|
||||||
.social-login p{ | ||||||
color: #373740; | ||||||
font-size: 14px; | ||||||
font-family: Pretendard; | ||||||
font-weight: 400; | ||||||
} | ||||||
|
||||||
.social-login .image2{ | ||||||
width:42px; | ||||||
height:42px; | ||||||
background-color: #FEE500; | ||||||
border-radius: 37.33px; | ||||||
position: relative; | ||||||
} | ||||||
|
||||||
.social-login .image1{ | ||||||
width:42px; | ||||||
height:42px; | ||||||
background-color: #FFFFFF; | ||||||
border-radius: 37.33px; | ||||||
position: relative; | ||||||
border: 1px #D3D4DD solid; | ||||||
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); | ||||||
} | ||||||
|
||||||
.image2 img{ | ||||||
position: absolute; | ||||||
top: 10px; | ||||||
bottom: 8px; | ||||||
left: 8px; | ||||||
right: 8px; | ||||||
} | ||||||
|
||||||
.image1 img{ | ||||||
position: absolute; | ||||||
top: 10px; | ||||||
bottom: 10px; | ||||||
left: 10px; | ||||||
right: 10px; | ||||||
} | ||||||
|
||||||
.pwd-input-check p{ | ||||||
color: #FF5B56; | ||||||
font-size: 14px; | ||||||
font-family: Pretendard; | ||||||
font-weight: 400; | ||||||
} | ||||||
|
||||||
.pwd-input form{ | ||||||
background-image: url(eye-off.svg); | ||||||
} |
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.
각 파일마다 마지막에 빈 줄을 하나씩 넣어주는 것을 권장해요.
(찾아보기 키워드: EOL, end of line, 파일 마지막 개행)