Skip to content

Commit eff3d9b

Browse files
ByungyeonKimByungyeonKim
authored
Merge pull request #93 from Jiii-Eun/React-최지은
[최지은] sprint5
2 parents a6ff030 + 83a0bcf commit eff3d9b

104 files changed

Lines changed: 6528 additions & 0 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.github/pull_request_template.md‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
## 요구사항
2+
3+
### 기본
4+
5+
- [x]
6+
- []
7+
- []
8+
9+
### 심화
10+
11+
- [x]
12+
- []
13+
14+
## 주요 변경사항
15+
16+
-
17+
-
18+
19+
## 스크린샷
20+
21+
![image](이미지url)
22+
23+
## 멘토에게
24+
25+
-
26+
-
27+
- 셀프 코드 리뷰를 통해 질문 이어가겠습니다.

‎.github/workflows/delete-merged-branch-config.yml‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
name: delete branch on close pr
2+
3+
on:
4+
pull_request:
5+
types: [closed]
6+
7+
jobs:
8+
delete-branch:
9+
runs-on: ubuntu-latest
10+
steps:
11+
- name: delete branch
12+
uses: SvanBoxel/delete-merged-branch@main
13+
env:
14+
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

‎.gitignore‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎1-4/css/auth.css‎

Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
.material-symbols-outlined {
2+
font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
3+
}
4+
* {
5+
color: var(--gray-800);
6+
}
7+
html,
8+
body {
9+
height: 100%;
10+
}
11+
12+
.auth_container {
13+
min-height: 100%;
14+
min-width: 16rem;
15+
display: flex;
16+
align-items: center;
17+
justify-content: center;
18+
}
19+
20+
.width_container {
21+
max-width: 40rem;
22+
width: 100%;
23+
}
24+
25+
.user_input label,
26+
.user_input input,
27+
.auth.btn {
28+
display: block;
29+
width: 100%;
30+
}
31+
32+
.user_input label {
33+
font-size: 1.125rem;
34+
font-weight: 700;
35+
margin-bottom: 1rem;
36+
}
37+
38+
.user_input input,
39+
.auth.btn {
40+
margin-bottom: 1.5rem;
41+
}
42+
43+
.logo {
44+
justify-content: center;
45+
margin-bottom: 2.5rem;
46+
}
47+
.logo h1 {
48+
font-size: 4.15rem;
49+
}
50+
.logo_img {
51+
max-width: 6.5rem;
52+
}
53+
54+
.user_input input {
55+
background-color: var(--gray-100);
56+
border-radius: 0.75rem;
57+
padding: 0 1.5rem;
58+
}
59+
60+
.error_text {
61+
position: absolute;
62+
bottom: -1rem;
63+
left: 0;
64+
font-size: 0.875rem;
65+
color: #ff0000;
66+
}
67+
68+
.auth.btn {
69+
font-size: 1.25rem;
70+
font-weight: 600;
71+
background-color: var(--gray-400);
72+
}
73+
74+
.input_wrap {
75+
position: relative;
76+
}
77+
.password_icon {
78+
position: absolute;
79+
right: 1.5rem;
80+
top: 50%;
81+
transform: translateY(-50%);
82+
cursor: pointer;
83+
}
84+
85+
.icon_cover {
86+
width: 2.625rem;
87+
height: 2.625rem;
88+
border-radius: 50%;
89+
overflow: hidden;
90+
}
91+
.sns_icon {
92+
display: block;
93+
}
94+
95+
.auth_text a {
96+
color: var(--primary-100);
97+
border-bottom: 0.06rem solid var(--primary-100);
98+
}
99+
100+
.simple_login {
101+
display: flex;
102+
justify-content: space-between;
103+
align-items: center;
104+
margin-bottom: 1.5rem;
105+
background-color: #e6f2ff;
106+
padding: 1rem 1.5rem;
107+
border-radius: var(--border-8);
108+
}
109+
110+
.simple_login span {
111+
word-break: keep-all;
112+
font-weight: 500;
113+
}
114+
.sns_login {
115+
display: flex;
116+
justify-content: flex-end;
117+
gap: 1rem;
118+
}
119+
120+
.auth_helper {
121+
text-align: center;
122+
}
123+
.auth_link {
124+
margin-left: 0.3rem;
125+
}
126+
127+
@media screen and (max-width: 767px) {
128+
.auth_container {
129+
padding: 1rem;
130+
}
131+
132+
.logo h1 {
133+
font-size: 2rem;
134+
}
135+
.logo_img {
136+
max-width: 3.25rem;
137+
}
138+
.user_input label {
139+
font-size: 0.875rem;
140+
margin-bottom: 0.5rem;
141+
}
142+
143+
.width_container {
144+
max-width: 25rem;
145+
}
146+
}

‎1-4/css/common.css‎

Lines changed: 141 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,141 @@
1+
* {
2+
color: var(--gray-700);
3+
}
4+
h2,
5+
.main span {
6+
font-weight: 700;
7+
}
8+
h2 {
9+
font-size: 2.5rem;
10+
word-break: keep-all;
11+
line-height: 3rem;
12+
}
13+
14+
section:not(.main) {
15+
background-color: #cfe5ff;
16+
}
17+
18+
.intro,
19+
.ending {
20+
padding-top: 4.2rem;
21+
}
22+
.flex_div {
23+
height: 33rem;
24+
display: flex;
25+
justify-content: space-between;
26+
align-items: flex-end;
27+
}
28+
.title_div {
29+
margin-bottom: 6.25rem;
30+
width: 30rem;
31+
}
32+
.ending .title_div {
33+
margin-bottom: 11rem;
34+
}
35+
36+
.intro h2 {
37+
margin-bottom: 2rem;
38+
}
39+
40+
.intro .shopping {
41+
display: block;
42+
font-size: 1.25rem;
43+
text-align: center;
44+
width: 21rem;
45+
}
46+
47+
.main img {
48+
max-width: 36.75rem;
49+
}
50+
.main .card {
51+
display: flex;
52+
align-items: center;
53+
justify-content: center;
54+
gap: 3.5rem;
55+
padding: 7rem 0;
56+
}
57+
.main .card.right {
58+
flex-direction: row-reverse;
59+
text-align: right;
60+
}
61+
62+
.card_info span {
63+
display: block;
64+
font-size: 1.125rem;
65+
color: var(--primary-100);
66+
margin-bottom: 1.4rem;
67+
}
68+
.card_info h2 {
69+
width: 18rem;
70+
margin-bottom: 2.8rem;
71+
}
72+
.card_info p {
73+
font-size: 1.5rem;
74+
}
75+
76+
@media screen and (max-width: 1199px) {
77+
.flex_div {
78+
flex-direction: column;
79+
justify-content: flex-end;
80+
align-items: center;
81+
gap: 5rem;
82+
text-align: center;
83+
}
84+
.intro .flex_div {
85+
height: 48rem;
86+
}
87+
.ending .flex_div {
88+
height: 58rem;
89+
}
90+
.title_div {
91+
display: flex;
92+
flex-direction: column;
93+
justify-content: center;
94+
align-items: center;
95+
width: 100%;
96+
}
97+
98+
.card_outter {
99+
margin: 1.5rem;
100+
}
101+
102+
.main .card.right {
103+
flex-direction: column;
104+
}
105+
.main .card {
106+
flex-direction: column;
107+
align-items: unset;
108+
padding: 0 0 3.25rem;
109+
}
110+
.main img {
111+
max-width: 100%;
112+
border-radius: var(--border-16);
113+
}
114+
.card_info h2 {
115+
width: 100%;
116+
font-size: 2rem;
117+
margin-bottom: 1.5rem;
118+
}
119+
.card_info p {
120+
font-size: 1.125rem;
121+
}
122+
}
123+
124+
@media screen and (max-width: 767px) {
125+
.intro,
126+
.ending {
127+
padding-top: 0;
128+
}
129+
130+
.flex_div {
131+
height: 33.75rem;
132+
}
133+
134+
.title_div {
135+
max-width: 21rem;
136+
}
137+
138+
.main .card {
139+
padding: 1.5rem 0;
140+
}
141+
}

0 commit comments

Comments
 (0)