-
Notifications
You must be signed in to change notification settings - Fork 35
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
[장혁수] sprint5 #144
The head ref may contain hidden characters: "React-\uC7A5\uD601\uC218-sprint5"
[장혁수] sprint5 #144
Changes from all commits
b2e37bd
6f8bbb0
e11e25f
212e864
4dc5dd0
3cd47c6
043cffe
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Large diffs are not rendered by default.
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -2,42 +2,9 @@ | |
<html lang="en"> | ||
<head> | ||
<meta charset="utf-8" /> | ||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1" /> | ||
<meta name="theme-color" content="#000000" /> | ||
<meta | ||
name="description" | ||
content="Web site created using create-react-app" | ||
/> | ||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" /> | ||
<!-- | ||
manifest.json provides metadata used when your web app is installed on a | ||
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/ | ||
--> | ||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> | ||
<!-- | ||
Notice the use of %PUBLIC_URL% in the tags above. | ||
It will be replaced with the URL of the `public` folder during the build. | ||
Only files inside the `public` folder can be referenced from the HTML. | ||
|
||
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will | ||
work correctly both with client-side routing and a non-root public URL. | ||
Learn how to configure a non-root public URL by running `npm run build`. | ||
--> | ||
<title>React App</title> | ||
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. 저희 판다마켓이니까 title도 변경해주시면 될 것 같습니다. |
||
</head> | ||
<body> | ||
<noscript>You need to enable JavaScript to run this app.</noscript> | ||
<div id="root"></div> | ||
<!-- | ||
This HTML file is a template. | ||
If you open it directly in the browser, you will see an empty page. | ||
|
||
You can add webfonts, meta tags, or analytics to this file. | ||
The build step will place the bundled scripts into the <body> tag. | ||
|
||
To begin the development, run `npm start` or `yarn start`. | ||
To create a production bundle, use `npm run build` or `yarn build`. | ||
--> | ||
</body> | ||
</html> |
This file was deleted.
This file was deleted.
This file was deleted.
This file was deleted.
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,67 @@ | ||
header { | ||
display: flex; | ||
align-items: center; | ||
width: 100%; | ||
height: 70px; | ||
padding: 0 200px; | ||
gap: 20px; | ||
border: 1px solid #dfdfdf; | ||
position: fixed; | ||
left: 0; | ||
top: 0; | ||
background-color: #fff; | ||
} | ||
|
||
a { | ||
text-decoration: none; | ||
} | ||
|
||
.home-button { | ||
display: inline-flex; | ||
width: 153px; | ||
height: 51px; | ||
} | ||
|
||
.nav-box { | ||
display: flex; | ||
width: 100%; | ||
} | ||
|
||
.nav-item { | ||
display: inline-flex; | ||
align-items: center; | ||
justify-content: center; | ||
width: 109px; | ||
height: 69px; | ||
font-weight: 700; | ||
font-size: 18px; | ||
line-height: 21px; | ||
color: #4b5563; | ||
} | ||
|
||
.login-button { | ||
display: inline-flex; | ||
align-items: center; | ||
justify-content: center; | ||
width: 88px; | ||
height: 42px; | ||
border-radius: 8px; | ||
gap: 10px; | ||
background-color: #3692ff; | ||
font-weight: 600; | ||
font-size: 16px; | ||
line-height: 19px; | ||
color: #fff; | ||
} | ||
|
||
@media (max-width: 1199px) { | ||
header { | ||
padding: 0 24px; | ||
} | ||
} | ||
|
||
@media (max-width: 767px) { | ||
header { | ||
padding: 0 16px; | ||
} | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import './Header.css'; | ||
import logo from './images/logo1.png'; | ||
|
||
function Header() { | ||
return ( | ||
<header> | ||
<a href="/" className="home-button"> | ||
<img src={logo} alt="로고" /> | ||
</a> | ||
<div className="nav-box"> | ||
<a href="/#" className="nav-item"> | ||
자유게시판 | ||
</a> | ||
<a href="/items" className="nav-item"> | ||
중고마켓 | ||
</a> | ||
</div> | ||
<a href="/login" className="login-button"> | ||
로그인 | ||
</a> | ||
</header> | ||
); | ||
} | ||
|
||
export default Header; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
import './items.css'; | ||
|
||
function Items() { | ||
return ( | ||
<> | ||
<div className="main"> | ||
<h2>베스트 상품</h2> | ||
<div className="best-wrapper">상품들</div> | ||
<div className="onsale-bar"> | ||
<h2>판매 중인 상품</h2> | ||
<input /> | ||
<a href="/#">상품 등록하기</a> | ||
<select> | ||
<option>최신순</option> | ||
<option>좋아요순</option> | ||
</select> | ||
</div> | ||
<div className="onsale-wrapper">상품들</div> | ||
</div> | ||
<ul className="pagination-container"> | ||
<li>좌</li> | ||
<li>1</li> | ||
<li>2</li> | ||
<li>3</li> | ||
<li>4</li> | ||
<li>5</li> | ||
<li>우</li> | ||
</ul> | ||
</> | ||
); | ||
} | ||
|
||
export default Items; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,13 +1,14 @@ | ||
body { | ||
@font-face { | ||
font-family: 'Pretendard-Regular'; | ||
src: url('./fonts/Pretendard-Regular.ttf') format('truetype'); | ||
} | ||
|
||
* { | ||
margin: 0; | ||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', | ||
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', | ||
sans-serif; | ||
-webkit-font-smoothing: antialiased; | ||
-moz-osx-font-smoothing: grayscale; | ||
padding: 0; | ||
box-sizing: border-box; | ||
} | ||
|
||
code { | ||
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', | ||
monospace; | ||
body { | ||
font-family: 'Pretendard-Regular', sans-serif; | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
.main { | ||
margin: 70px auto 0; | ||
display: flex; | ||
flex-direction: column; | ||
} | ||
|
||
.onsale-bar { | ||
display: flex; | ||
align-items: center; | ||
} | ||
|
||
.pagination-container { | ||
display: flex; | ||
list-style-type: none; | ||
} |
This file was deleted.
This file was deleted.
This file was deleted.
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.
lang ko로 바꿔주시면 좋을 것 같아요!