Skip to content

Commit 7325d4e

Browse files
k3iiMrSunshyne
k3ii
and
MrSunshyne
authored
Add NuxtContent module for docs (#207)
* feat(docs): add nuxt content module * nuxt(docs): Add slug.vue * docs: add test pages * fix(nuxt): add nuxt/content to package.json * chore: remove index from * feat: Add simple layout component and update dynamic page template * feat: Add History link to site menu and update site logo styling * chore: update pnpm lock file * chore: Update npm dependencies and add @nuxt/content module * feat: implement github flavored blockquotes * doc: copy contributing.md to content folder --------- Co-authored-by: Sandeep Ramgolam <sandeep@ramgolam.com>
1 parent 24f1ac4 commit 7325d4e

File tree

9 files changed

+628
-2
lines changed

9 files changed

+628
-2
lines changed

‎packages/frontendmu-nuxt/components/content/prose/ProseBlockquote.vue

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
<script setup lang="ts">
2+
const slots = useSlots()
3+
const children = slots.default?.()[0].children
4+
const key = children?.default?.()[0].children[0].children
5+
6+
const simplifiedKey = key.replace('!', '')
7+
8+
const typesOfQuotes = {
9+
'!NOTE': {
10+
class: 'bg-blue-100 border-blue-500 text-blue-900',
11+
class2: 'border-l-4 border-blue-500 text-blue-500',
12+
icon: 'carbon:information',
13+
},
14+
'!TIP': {
15+
class: 'bg-lime-100 border-lime-500 text-lime-900',
16+
class2: 'border-l-4 border-lime-500 text-lime-500',
17+
icon: 'carbon:idea',
18+
},
19+
'!IMPORTANT': {
20+
class: 'bg-purple-100 border-purple-500 text-purple-900',
21+
class2: 'border-l-4 border-purple-500 text-purple-500',
22+
icon: 'carbon:chat',
23+
},
24+
'!WARNING': {
25+
class: 'bg-yellow-100 border-yellow-500 text-yellow-900',
26+
class2: 'border-l-4 border-yellow-500 text-yellow-500',
27+
icon: 'carbon:warning-alt',
28+
},
29+
'!CAUTION': {
30+
class: 'bg-red-100 border-red-500 text-red-900',
31+
class2: 'border-l-4 border-red-500 text-red-500',
32+
icon: 'carbon:warning-hex',
33+
},
34+
}
35+
</script>
36+
37+
<template>
38+
<div class="px-4 py-2 bg-white/5 my-5" :class="typesOfQuotes[key]?.class2">
39+
<div class="flex items-center gap-2 font-bold">
40+
<template v-if="typesOfQuotes[key]?.icon">
41+
<Icon class="w-6 h-6" :name="typesOfQuotes[key]?.icon" />
42+
</template>
43+
<div>
44+
{{ simplifiedKey }}
45+
</div>
46+
</div>
47+
<div class="text-white">
48+
<slot />
49+
</div>
50+
</div>
51+
</template>

‎packages/frontendmu-nuxt/components/site/Menu.vue

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,11 @@ const links: TMenu = {
2727
// href: '/faq',
2828
// class: '',
2929
// },
30+
{
31+
title: 'History',
32+
href: '/history',
33+
class: '',
34+
},
3035
{
3136
title: 'WhatsApp',
3237
href: 'https://chat.whatsapp.com/invite/0kQ2QX0ZQ0j1YQ4X6Q4Q4Q',
@@ -123,8 +128,7 @@ onMounted(makeHeaderSticky)
123128
<div class="flex justify-between items-center">
124129
<div class="flex">
125130
<NuxtLink href="/" class="flex gap-2 text-verse-500 dark:text-verse-200" title="frontend.mu"
126-
@contextmenu="handleRightClick"
127-
>
131+
@contextmenu="handleRightClick">
128132
<SiteLogo class="w-10" />
129133
<span class="hidden text-lg font-bold leading-none tracking-tighter md:text-3xl md:block">
130134
frontend.mu

‎packages/frontendmu-nuxt/content/history.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
# History of Frontend Coders Mauritius
2+
3+
We're now in the 3rd iteration of the leadership of this community.
4+
5+
* Phase one - Founded by David Dias in 2016
6+
* Phase two - Cedric, Sandeep
7+
* Phase three - Sandeep, Kushul, Cedric
8+

‎packages/frontendmu-nuxt/content/how-to-contribute.md

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
<!-- omit in toc -->
2+
# Contributing to frontend.mu
3+
4+
Thank you for your interest in contributing to Frontend.mu! 🎉
5+
Our community-driven platform thrives on contributions from members like you, whether you're helping
6+
to organize events, enhancing the website, or simply sharing knowledge.
7+
8+
<!-- omit in toc -->
9+
## Table of Contents
10+
11+
- [Code of Conduct](#code-of-conduct)
12+
- [Ways to Contribute](#ways-to-contribute)
13+
- [Running the Project Locally](#running-the-project-locally)
14+
- [Submitting Contributions](#submitting-contributions)
15+
- [Reporting Issues and Suggestions](#reporting-issues-and-suggestions)
16+
- [Code Style and Guidelines](#code-style-and-guidelines)
17+
- [Acknowledgements](#acknowledgements)
18+
19+
## Code of Conduct
20+
21+
Please read and follow our [Code of Conduct](CODE_OF_CONDUCT.md) to ensure a welcoming and inclusive environment for everyone.
22+
23+
## Ways to Contribute
24+
25+
There are many ways you can contribute to Frontend.mu:
26+
27+
- **Event Organization:** Help us plan, promote, and run meetups. You can propose topics, suggest speakers, or volunteer to help with logistics.
28+
- **Design and Frontend Development:** Improve the look and feel of our website. Whether it's updating the UI, enhancing accessibility, or fixing bugs, your skills are invaluable.
29+
- **Speaker and Sponsor Management:** Assist in managing the list of speakers and sponsors, ensuring that information is up-to-date and accurately represented.
30+
- **Community Engagement:** Help us grow the community by spreading the word, engaging with attendees, and fostering discussions online and offline.
31+
32+
## Running the Project Locally
33+
34+
1. **Fork the Repository:** Start by forking the repository to create your own copy on GitHub.
35+
2. **Clone Your Fork:** Clone your forked repository to your local machine.
36+
3. **Open the Project:** Navigate to the cloned `frontend.mu` directory in your code editor.
37+
4. **Install Dependencies:** Run `pnpm install` to install the required packages.
38+
5. **Set Up Environment Variables:** Copy `.env.example` to `.env.development`:
39+
```bash
40+
cp .env.example .env.development
41+
```
42+
5. **Start the Development Server:** Use `pnpm run nuxt dev` to launch the project locally.
43+
44+
## Submitting Contributions
45+
46+
1. **Commit & Push:** Commit your changes and push them to your forked repository.
47+
2. **Open a Pull Request:** Head to your fork on GitHub, click on the `Contribute` button, and then `Open a pull request` to submit your changes.
48+
49+
## Reporting Issues and Suggestions
50+
51+
If you encounter any issues or have ideas for improvements, please open an issue on GitHub.
52+
Provide as much detail as possible, including screenshots or logs if applicable.
53+
54+
## Code Style and Guidelines
55+
56+
- Follow our [coding standards](CODING_GUIDELINES.md).
57+
- Ensure your code is well-documented and tested.
58+
- Use clear and concise commit messages.
59+
- Adhere to accessibility best practices.
60+
61+
## Acknowledgements
62+
63+
Thank you for being a part of Frontend.mu! Your contributions help us build a stronger community and better resources for frontend developers in Mauritius.
64+
If you have any questions, feel free to reach out to us via GitHub issues, Discord or at our next meetup!

‎packages/frontendmu-nuxt/layouts/simple.vue

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<script setup lang="ts">
2+
defineOgImageComponent('Generic')
3+
</script>
4+
5+
<template>
6+
<NuxtLoadingIndicator />
7+
<LayoutBackdrop>
8+
<SiteNavigation />
9+
10+
<slot />
11+
12+
<SiteFooter />
13+
</LayoutBackdrop>
14+
</template>

‎packages/frontendmu-nuxt/nuxt.config.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ export default defineNuxtConfig({
2424
'@nuxtjs/seo',
2525
'shadcn-nuxt',
2626
'@nuxt/image',
27+
'@nuxt/content',
2728
],
2829

2930
eslint: {

‎packages/frontendmu-nuxt/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
"codegen": "playwright codegen"
1515
},
1616
"dependencies": {
17+
"@nuxt/content": "^2.13.2",
1718
"@nuxt/fonts": "^0.7.1",
1819
"@nuxt/icon": "^1.4.5",
1920
"@nuxt/image": "^1.7.0",

‎packages/frontendmu-nuxt/pages/[...slug].vue

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<script lang="ts" setup>
2+
definePageMeta({
3+
layout: 'simple',
4+
})
5+
</script>
6+
7+
<template>
8+
<main>
9+
<div class="contain dark:bg-verse-900 bg-gray-50 py-16 px-8 rounded-2xl">
10+
<div class="prose dark:prose-invert">
11+
<ContentDoc />
12+
</div>
13+
</div>
14+
</main>
15+
</template>

0 commit comments

Comments
 (0)