diff --git a/assets/img/ic_down.png b/assets/img/ic_down.png new file mode 100644 index 0000000..ca4e0d8 Binary files /dev/null and b/assets/img/ic_down.png differ diff --git a/components/about/activity/card.vue b/components/about/activity/card.vue new file mode 100644 index 0000000..f092727 --- /dev/null +++ b/components/about/activity/card.vue @@ -0,0 +1,69 @@ + + + + + diff --git a/components/about/info/card.vue b/components/about/info/card.vue new file mode 100644 index 0000000..50f1bd3 --- /dev/null +++ b/components/about/info/card.vue @@ -0,0 +1,77 @@ + + + + + diff --git a/components/about/review/card.vue b/components/about/review/card.vue new file mode 100644 index 0000000..f9c8bf9 --- /dev/null +++ b/components/about/review/card.vue @@ -0,0 +1,93 @@ + + + + + diff --git a/content/about/activities/1.json b/content/about/activities/1.json new file mode 100644 index 0000000..2aedc29 --- /dev/null +++ b/content/about/activities/1.json @@ -0,0 +1,5 @@ +{ + "description": "팀을 이루어서\nIT 프로젝트를 진행합니다.", + "title": "IT Project", + "thumbnail": "" +} diff --git a/content/about/activities/2.json b/content/about/activities/2.json new file mode 100644 index 0000000..6913ec6 --- /dev/null +++ b/content/about/activities/2.json @@ -0,0 +1,5 @@ +{ + "description": "현직자의\n경험을 공유합니다", + "title": "Invitation Session", + "thumbnail": "" +} diff --git a/content/about/activities/3.json b/content/about/activities/3.json new file mode 100644 index 0000000..4586308 --- /dev/null +++ b/content/about/activities/3.json @@ -0,0 +1,5 @@ +{ + "description": "몰입할 수 있는 환경을\n제공합니다", + "title": "Hackathon", + "thumbnail": "" +} diff --git a/content/about/activities/4.json b/content/about/activities/4.json new file mode 100644 index 0000000..6424fc9 --- /dev/null +++ b/content/about/activities/4.json @@ -0,0 +1,5 @@ +{ + "description": "새로운 사람들과\n정보를 공유합니다", + "title": "Networking", + "thumbnail": "" +} diff --git a/content/about/informations/duration.json b/content/about/informations/duration.json new file mode 100644 index 0000000..32166e2 --- /dev/null +++ b/content/about/informations/duration.json @@ -0,0 +1,5 @@ +{ + "title": "운영 기간", + "value": "10년", + "description": "2012부터" +} diff --git a/content/about/informations/launching.json b/content/about/informations/launching.json new file mode 100644 index 0000000..f75e007 --- /dev/null +++ b/content/about/informations/launching.json @@ -0,0 +1,5 @@ +{ + "title": "런칭 서비스", + "value": "80개+", + "description": "기수별 런칭율 60%" +} diff --git a/content/about/informations/members.json b/content/about/informations/members.json new file mode 100644 index 0000000..c042c89 --- /dev/null +++ b/content/about/informations/members.json @@ -0,0 +1,5 @@ +{ + "title": "가입 회원수", + "value": "500명+", + "description": "신규 기수마다 약 20명 증가" +} diff --git a/content/about/reviews/1.json b/content/about/reviews/1.json new file mode 100644 index 0000000..04daf65 --- /dev/null +++ b/content/about/reviews/1.json @@ -0,0 +1,8 @@ +{ + "th": "19기", + "thBackgroundColor": "#B5B8FF", + "thTextColor": "#5236FF", + "title": "IT 연합 동아리 NEXTERS(넥스터즈) 활동 후기 - 개발왕, 도던", + "author": "개발왕, 도던", + "href": "https://makemethink.tistory.com/103" +} diff --git a/content/about/reviews/2.json b/content/about/reviews/2.json new file mode 100644 index 0000000..04daf65 --- /dev/null +++ b/content/about/reviews/2.json @@ -0,0 +1,8 @@ +{ + "th": "19기", + "thBackgroundColor": "#B5B8FF", + "thTextColor": "#5236FF", + "title": "IT 연합 동아리 NEXTERS(넥스터즈) 활동 후기 - 개발왕, 도던", + "author": "개발왕, 도던", + "href": "https://makemethink.tistory.com/103" +} diff --git a/content/about/reviews/3.json b/content/about/reviews/3.json new file mode 100644 index 0000000..04daf65 --- /dev/null +++ b/content/about/reviews/3.json @@ -0,0 +1,8 @@ +{ + "th": "19기", + "thBackgroundColor": "#B5B8FF", + "thTextColor": "#5236FF", + "title": "IT 연합 동아리 NEXTERS(넥스터즈) 활동 후기 - 개발왕, 도던", + "author": "개발왕, 도던", + "href": "https://makemethink.tistory.com/103" +} diff --git a/content/about/reviews/4.json b/content/about/reviews/4.json new file mode 100644 index 0000000..0a405b0 --- /dev/null +++ b/content/about/reviews/4.json @@ -0,0 +1,8 @@ +{ + "th": "18기", + "thBackgroundColor": "#D2FFBD", + "thTextColor": "#66C839", + "title": "IT 연합 동아리 NEXTERS(넥스터즈) 활동 후기 - 개발왕, 도던", + "author": "개발왕, 도던", + "href": "https://makemethink.tistory.com/103" +} diff --git a/content/about/reviews/5.json b/content/about/reviews/5.json new file mode 100644 index 0000000..0a405b0 --- /dev/null +++ b/content/about/reviews/5.json @@ -0,0 +1,8 @@ +{ + "th": "18기", + "thBackgroundColor": "#D2FFBD", + "thTextColor": "#66C839", + "title": "IT 연합 동아리 NEXTERS(넥스터즈) 활동 후기 - 개발왕, 도던", + "author": "개발왕, 도던", + "href": "https://makemethink.tistory.com/103" +} diff --git a/content/about/reviews/6.json b/content/about/reviews/6.json new file mode 100644 index 0000000..af5baa0 --- /dev/null +++ b/content/about/reviews/6.json @@ -0,0 +1,8 @@ +{ + "th": "17기", + "thBackgroundColor": "#FFD9C3", + "thTextColor": "#FF5209", + "title": "IT 연합 동아리 NEXTERS(넥스터즈) 활동 후기 - 개발왕, 도던", + "author": "개발왕, 도던", + "href": "https://makemethink.tistory.com/103" +} diff --git a/content/about/slogan.json b/content/about/slogan.json new file mode 100644 index 0000000..e69de29 diff --git a/nuxt.config.ts b/nuxt.config.ts index 753a3ea..63842c1 100644 --- a/nuxt.config.ts +++ b/nuxt.config.ts @@ -12,6 +12,7 @@ const config: NuxtConfig = { modules: ["@nuxt/content"], components: [ "~/components", + { path: "~/components/about", extensions: ["vue"] }, { path: "~/components/project", extensions: ["vue"] }, ], content: { diff --git a/pages/about.vue b/pages/about.vue index 3b81420..37c260c 100644 --- a/pages/about.vue +++ b/pages/about.vue @@ -18,18 +18,39 @@ /> -
- +

{{ act.title }}

+
+ +
+
+
+

{{ review.title }}

+
+ +
+
+
+

Lead more

+ +
+
-
-
Lead more
@@ -44,7 +65,24 @@ export default defineComponent({ const informations = await $content("about/informations") .only(["title", "value", "description"]) .fetch(); - return { info: { title: "10년째\n멈추지 않는 열정", items: informations } }; + const activities = await $content("about/activities") + .only(["description", "title", "thumbnail"]) + .fetch(); + const reviews = await $content("about/reviews") + .only([ + "th", + "thBackgroundColor", + "thTextColor", + "title", + "author", + "href", + ]) + .fetch(); + return { + info: { title: "10년째\n멈추지 않는 열정", items: informations }, + act: { title: "함께하는\n다양한 활동", items: activities }, + review: { title: "회원들의\n생생한 활동 후기", items: reviews }, + }; }, data() { return { @@ -61,6 +99,7 @@ export default defineComponent({ items: [], }, review: { + title: "회원들의\n생생한 활동 후기", items: [], }, }; @@ -82,6 +121,11 @@ export default defineComponent({ } @include desktop { .contents { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + gap: 120px; width: 1200px; margin: 0 auto 0 auto; } @@ -131,5 +175,51 @@ export default defineComponent({ gap: 48px; } } + .activities { + display: flex; + flex-direction: column; + gap: 48px; + .cards { + display: flex; + flex-direction: row; + justify-content: space-between; + box-sizing: border-box; + flex-wrap: wrap; + gap: 48px; + } + } + .reviews { + display: flex; + flex-direction: column; + gap: 24px; + .cards { + display: flex; + flex-direction: row; + justify-content: space-between; + box-sizing: border-box; + flex-wrap: wrap; + gap: 24px; + } + .more { + display: flex; + flex-direction: column; + align-items: center; + margin-bottom: 120px; + .lead-more { + display: flex; + justify-content: space-between; + align-items: center; + width: 155px; + height: 68px; + cursor: pointer; + font-style: normal; + font-weight: bold; + font-size: 24px; + line-height: 36px; + letter-spacing: -0.02em; + color: #777777; + } + } + } }