feat: add contributing page

app/(root)/contribute/page.jsx

@@ -0,0 +1,53 @@
+import ReactMarkdown from "react-markdown";
+import { contribute } from "@/constants/guidelines";
+
+export const metadata = {
+  title: "Contribute - MERNMail",
+  description:
+    "Contribute to MERNMail and be part of an exciting open-source project. Follow the guidelines to contribute to our code.",
+  openGraph: {
+    title: "Contribute - MERNMail",
+    description:
+      "Contribute to MERNMail and be part of an exciting open-source project. Follow the guidelines to contribute to our code.",
+    url: `${process.env.NEXT_PUBLIC_WEBSITE_URL}`,
+    type: "website",
+    images: [
+      {
+        url: `${process.env.NEXT_PUBLIC_WEBSITE_URL}/metadata/mernmail-cover.png`,
+        width: 2560,
+        height: 1440,
+        alt: "Contribute - MERNMail"
+      }
+    ]
+  },
+  twitter: {
+    card: "summary_large_image",
+    site: "@MERNMail",
+    title: "Contribute - MERNMail",
+    description:
+      "Contribute to MERNMail and be part of an exciting open-source project. Follow the guidelines to contribute to our code.",
+    images: [
+      `${process.env.NEXT_PUBLIC_WEBSITE_URL}/metadata/mernmail-cover.png`
+    ],
+    creator: "@MERNMail"
+  }
+};
+
+function Contribute() {
+  return (
+    <main className="max-w-screen-xl mx-auto px-4 py-6 md:py-28 gap-2 flex flex-col">
+      <h1 className="text-3xl md:text-5xl pb-1 md:pb-2 font-bold">
+        Contributing to MERNMail
+      </h1>
+      <p className="md:text-lg text-muted-foreground text-start mb-6">
+        We welcome contributions from the community! Here&apos;s how you can
+        help!
+      </p>
+      <div className="prose prose-a:text-primary max-w-full md:prose-lg dark:prose-invert">
+        <ReactMarkdown>{contribute}</ReactMarkdown>
+      </div>
+    </main>
+  );
+}
+
+export default Contribute;

constants/guidelines.jsx

@@ -0,0 +1,35 @@
+export const contribute = `
+## Git server details
+
+The Git server runs Forgejo Git hosting package and it's located at [https://git.svrjs.org/](https://git.svrjs.org/).
+
+If you have enabled two-factor authentication or logged in via GitHub, generate an access token and use it as a password in Git CLI.
+
+## Reporting Bugs
+
+If you find a bug, please open an issue on our issue tracker with a detailed description of the problem and steps to reproduce it.
+
+## Submitting Patches
+
+We accept patches via pull requests. Here's our process:
+
+1. **Fork** the project.
+2. **Create a branch** for your patch.
+3. **Commit** your changes with descriptive commit messages.
+4. **Push** your branch to your fork.
+5. **Open a pull request** against the main repository.
+
+## Running Tests
+
+Before submitting a pull request, please run the tests to ensure your changes haven't introduced any new issues.
+
+## Documentation
+
+If your contribution changes existing functionality or adds new features, please update the documentation accordingly.
+
+## License
+
+By contributing to our project, you agree that your contributions will be licensed under our project's license.
+
+Thank you for considering contributing to our project!
+`;

package.json

@@ -12,17 +12,20 @@
     "cz": "cz"
   },
   "dependencies": {
+    "@tailwindcss/typography": "^0.5.15",
     "lucide-react": "^0.454.0",
     "next": "^15.0.2",
     "next-themes": "^0.4.3",
     "prop-types": "^15.8.1",
     "react": "^18.3.1",
-    "react-dom": "^18.3.1"
+    "react-dom": "^18.3.1",
+    "react-markdown": "^9.0.1"
   },
   "devDependencies": {
     "@commitlint/cli": "^19.5.0",
     "@commitlint/config-conventional": "^19.5.0",
     "@swc/cli": "^0.5.0",
+    "@types/react": "18.3.12",
     "autoprefixer": "^10.4.20",
     "cz-conventional-changelog": "^3.3.0",
     "eslint": "^8",

tailwind.config.js

@@ -66,5 +66,5 @@ module.exports = {
       }
     }
   },
-  plugins: []
+  plugins: [require("@tailwindcss/typography")]
 };