Skip to content

Commit

Permalink
main page
Browse files Browse the repository at this point in the history
  • Loading branch information
HyunaKim1010 committed Dec 29, 2020
1 parent 7bc3c41 commit a760d51
Show file tree
Hide file tree
Showing 8 changed files with 194 additions and 9 deletions.
32 changes: 32 additions & 0 deletions packages/dodam/components/GridView.js
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>;
}
Binary file added packages/dodam/images/mainBanner.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 2 additions & 0 deletions packages/dodam/next.config.js
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();
1 change: 1 addition & 0 deletions packages/dodam/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
"@dodam/components": "0.1.0",
"bootstrap": "^5.0.0-beta1",
"next": "10.0.3",
"next-images": "^1.6.2",
"react": "17.0.1",
"react-datepicker": "^3.3.0",
"react-dom": "17.0.1",
Expand Down
33 changes: 32 additions & 1 deletion packages/dodam/pages/_app.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,38 @@ const Dodam = ({ Component, pageProps }) => (
<style jsx>
{`
.dodam-root {
padding: 58px 8px 8px 8px;
padding: 50px 0px 0px 0px;
}
`}
</style>
<style jsx global>
{`
body {
width: 100vw;
}
:root {
/* Colors: */
--unnamed-color-ebba00: #ebba00;
--unnamed-color-191919: #191919;
/* Font/text values */
--unnamed-font-family-noto-sans-cjk-kr: Noto Sans CJK KR;
--unnamed-font-style-normal: normal;
--unnamed-font-weight-normal: normal;
--unnamed-font-size-40: 40px;
--unnamed-character-spacing-0: 0px;
--unnamed-line-spacing-59: 59px;
}
/* Character Styles */
.unnamed-character-style-1 {
font-family: var(--unnamed-font-family-noto-sans-cjk-kr);
font-style: var(--unnamed-font-style-normal);
font-weight: var(--unnamed-font-weight-normal);
font-size: var(--unnamed-font-size-40);
line-height: var(--unnamed-line-spacing-59);
letter-spacing: var(--unnamed-character-spacing-0);
color: var(--unnamed-color-8c8c8c);
}
`}
</style>
Expand Down
5 changes: 5 additions & 0 deletions packages/dodam/pages/group/enroll.js
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>;
}
122 changes: 114 additions & 8 deletions packages/dodam/pages/index.js
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>
);
}
8 changes: 8 additions & 0 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -11490,6 +11490,14 @@ nested-error-stacks@^2.0.0, nested-error-stacks@^2.1.0:
resolved "https://registry.yarnpkg.com/nested-error-stacks/-/nested-error-stacks-2.1.0.tgz#0fbdcf3e13fe4994781280524f8b96b0cdff9c61"
integrity sha512-AO81vsIO1k1sM4Zrd6Hu7regmJN1NSiAja10gc4bX3F0wd+9rQmcuHQaHVQCYIEC8iFXnE+mavh23GOt7wBgug==

next-images@^1.6.2:
version "1.6.2"
resolved "https://registry.yarnpkg.com/next-images/-/next-images-1.6.2.tgz#e5535ba468c3c857025e7fa07a27c773326223ad"
integrity sha512-tmINk0NzJ/D7Kk16x9gOgTd9wlcVG4IfyEcQqt/SY31miwuv5pzUhT7fakO2fYPrXimHOEPBaacCz1G6jADcbQ==
dependencies:
file-loader "^6.0.0"
url-loader "^4.0.0"

next-tick@~1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/next-tick/-/next-tick-1.0.0.tgz#ca86d1fe8828169b0120208e3dc8424b9db8342c"
Expand Down

0 comments on commit a760d51

Please sign in to comment.