forked from Double-Slash/5th-final-team2.5
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
7bc3c41
commit a760d51
Showing
8 changed files
with
194 additions
and
9 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
// const GridtView = { | ||
// { | ||
// "key": "1", | ||
// "name": "Club", | ||
// // "imageUrl" : "" | ||
// }, | ||
// { | ||
// "key": "2", | ||
// "name": "Club", | ||
// // "imageUrl" : "" | ||
// }, | ||
// { | ||
// "key": "3", | ||
// "name": "Club", | ||
// // "imageUrl" : "" | ||
// }, | ||
// { | ||
// "key": "4", | ||
// "name": "Club", | ||
// // "imageUrl" : "" | ||
// }, | ||
// }; | ||
|
||
export default function GridtView(props) { | ||
const dataList = props.data.map((data, i) => ( | ||
<div className="col-6"> | ||
<img className="img-temp" src={data.imageUrl} /> | ||
<div className="title-temp">{data.title}</div> | ||
</div> | ||
)); | ||
return <div className="row">{dataList}</div>; | ||
} |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,5 @@ | ||
const withTM = require('next-transpile-modules')(['@dodam/components'], true); | ||
const withImages = require('next-images'); | ||
|
||
module.exports = withTM(); | ||
module.exports = withImages(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
import { Button } from '@dodam/components'; | ||
|
||
export default function Enroll() { | ||
return <h1>ENROOL PAGE</h1>; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,13 +1,119 @@ | ||
import { InputBox, Button, DatePicker } from '@dodam/components'; | ||
import TestParagraph from '@/components/TestParagraph'; | ||
import { Button } from '@dodam/components'; | ||
import mainBanner from '@/images/mainBanner.png'; | ||
import GridView from '@/components/GridView.js'; | ||
|
||
export default function Home() { | ||
let data = [ | ||
{ | ||
imageUrl: '1.png', | ||
title: '1번 타이틀', | ||
}, | ||
{ | ||
imageUrl: '2.png', | ||
title: '2번 타이틀', | ||
}, | ||
{ | ||
imageUrl: '3.png', | ||
title: '3번 타이틀', | ||
}, | ||
{ | ||
imageUrl: '4.png', | ||
title: '4번 타이틀', | ||
}, | ||
]; | ||
|
||
let weekData = [ | ||
{ | ||
imageUrl: '1.png', | ||
title: '1번 타이틀', | ||
}, | ||
{ | ||
imageUrl: '2.png', | ||
title: '2번 타이틀', | ||
}, | ||
{ | ||
imageUrl: '3.png', | ||
title: '3번 타이틀', | ||
}, | ||
]; | ||
|
||
export default function Main() { | ||
const dataList = weekData.map((data, i) => ( | ||
<div className="col-4"> | ||
<img className="img-temp" src={data.imageUrl} /> | ||
<div className="title-temp">{data.title}</div> | ||
</div> | ||
)); | ||
return ( | ||
<div> | ||
<InputBox type="text" placeholder="placeholder text" /> | ||
<DatePicker selected={new Date()} onChange={(date) => console.log(date)} /> | ||
<Button>Click</Button> | ||
<TestParagraph /> | ||
<div className="w-100"> | ||
<div className="first-container"> | ||
<div className="title-wrapper"> | ||
<div className="title">나에게 맞는 최적의 동아리는?</div> | ||
<div className="sub-title"> | ||
성격유형분석을 통한 <br /> | ||
동아리맞춤 서비스를 만나보세요 | ||
</div> | ||
<Button className="test-start">테스트 시작</Button> | ||
</div> | ||
</div> | ||
<div className="container"> | ||
<div className="section-title">금주 동아리 랭킹</div> | ||
<div className="row">{dataList}</div> | ||
</div> | ||
<div className="container"> | ||
<div className="section-title">실시간 모집공고</div> | ||
<GridView data={data} /> | ||
</div> | ||
<div className="footer"> | ||
<span>FOOOOOOOOOOOTTTTTTTTTTTTEEEEEEEEEEERRRRRR</span> | ||
</div> | ||
<style jsx> | ||
{` | ||
.first-container { | ||
background-size: cover; | ||
background-repeat: no-repeat; | ||
background-image: url(${mainBanner}); | ||
padding-bottom: 100%; | ||
} | ||
.title-wrapper { | ||
margin-left: 40px; | ||
padding-top: 53px; | ||
color: #242424; | ||
opacity: 1; | ||
} | ||
.title { | ||
font: normal normal normal 13px/19px Noto Sans CJK KR; | ||
letter-spacing: -0.65px; | ||
} | ||
.sub-title { | ||
font: normal normal bold 22px/32px Noto Sans CJK KR; | ||
letter-spacing: -1.1px; | ||
} | ||
.section-title { | ||
text-align: left; | ||
font: normal normal bold 20px/29px Noto Sans CJK KR; | ||
letter-spacing: -1px; | ||
color: #191919; | ||
opacity: 1; | ||
} | ||
.footer { | ||
background-color: #000000; | ||
color: white; | ||
text-align: center; | ||
padding-top: 10%; | ||
padding-bottom: 10%; | ||
} | ||
`} | ||
</style> | ||
<style jsx global> | ||
{` | ||
.test-start { | ||
background: #191919 0% 0% no-repeat padding-box; | ||
border-radius: 19px; | ||
opacity: 1; | ||
margin-top: 28px; | ||
} | ||
`} | ||
</style> | ||
</div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters