feat: added faq section

README.md

@@ -1,7 +1,9 @@
 [![Starware](https://img.shields.io/badge/Starware-⭐-black?labelColor=f9b00d)](https://github.com/zepfietje/starware)
 
 <!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
+
 [![All Contributors](https://img.shields.io/badge/all_contributors-4-orange.svg?style=flat-square)](#contributors-)
+
 <!-- ALL-CONTRIBUTORS-BADGE:END -->
 
 [![Contributors][contributors-shield]][contributors-url]
@@ -66,51 +68,50 @@ The UI components are built using [Shadcn/UI](https://shadcn-ui.vercel.app/).
 
 Following technologies and libraries are used for the development of this website
 
-- [React](https://reactjs.org/)
-- [Vite](https://vitejs.dev/)
-- [Tailwind CSS](https://tailwindcss.com/)
-- [Shadcn/UI](https://shadcn-ui.vercel.app/)
-- [Cloudflare](https://www.cloudflare.com/)
-- [Redux](https://redux.js.org/)
-- [Firebase](https://firebase.google.com/)
-- [Netlify](https://www.netlify.com/)
+-  [React](https://reactjs.org/)
+-  [Vite](https://vitejs.dev/)
+-  [Tailwind CSS](https://tailwindcss.com/)
+-  [Shadcn/UI](https://shadcn-ui.vercel.app/)
+-  [Cloudflare](https://www.cloudflare.com/)
+-  [Redux](https://redux.js.org/)
+-  [Firebase](https://firebase.google.com/)
+-  [Netlify](https://www.netlify.com/)
 
 ## Getting Started
 
 To setup the project locally the steps below.
 
 ### Prerequisites
 
-- [Node.js](https://nodejs.org/en/download/)
-
-  ```sh
-  # homebrew
-  brew install nodejs
+-  [Node.js](https://nodejs.org/en/download/)
 
-  # sudo apt (Debian based systems)
-  sudo apt install nodejs
+   ```sh
+   # homebrew
+   brew install nodejs
 
-  # pacman (Arch Linux)
-  pacman -S nodejs
+   # sudo apt (Debian based systems)
+   sudo apt install nodejs
 
-  # module Install (Fedora)
-  dnf module install nodejs:<stream> # stream is the version
+   # pacman (Arch Linux)
+   pacman -S nodejs
 
-  # yum (CentOS, Red Hat)
-  yum install nodejs
+   # module Install (Fedora)
+   dnf module install nodejs:<stream> # stream is the version
 
-  # windows (chocolatey)
-  choco install nodejs
+   # yum (CentOS, Red Hat)
+   yum install nodejs
 
-  ```
+   # windows (chocolatey)
+   choco install nodejs
 
-- [PNPM](https://pnpm.io/installation)
-> [!NOTE]
-> Best way to install it is using `corepack`. It is recommended to use pnpm as the package manager for this project. It is faster and more efficient than npm and yarn.
+   ```
 
+-  [PNPM](https://pnpm.io/installation)
 
+   > [!NOTE]
+   > Best way to install it is using `corepack`. It is recommended to use pnpm as the package manager for this project. It is faster and more efficient than npm and yarn.
 
-- [Git](https://git-scm.com/downloads)
+-  [Git](https://git-scm.com/downloads)
 
 ```sh
   # homebrew
@@ -139,11 +140,11 @@ Our Slack Community: [Slack Invite](http://bit.ly/NITRDevs) <br>
 
 Please refer to the project's style and contribution guidelines for submitting patches and additions. In general, we follow the "fork-and-pull" Git workflow.
 
-1.  **Fork** the repo on GitHub
-2.  **Clone** the project to your local system
-3.  **Commit** changes to your own separate branch
-4.  **Push** your work back up to your fork
-5.  Submit a **Pull request** so that we can review your changes
+1. **Fork** the repo on GitHub
+2. **Clone** the project to your local system
+3. **Commit** changes to your own separate branch
+4. **Push** your work back up to your fork
+5. Submit a **Pull request** so that we can review your changes
 
 NOTE 1: Please abide by the [Contributing Guidelines](https://github.com/dscnitrourkela/project-unagi/blob/master/CONTRIBUTING.md).
 
@@ -178,7 +179,6 @@ pnpm dlx shadcn-ui@latest add <component-name>
 
 ```
 
-
 #### Adding/Removing Dependencies
 
 Following are the commands to remove/add new dependencies using yarn
@@ -243,4 +243,4 @@ Your appreciation makes us grow and glow up. ⭐
 <!-- markdownlint-restore -->
 <!-- prettier-ignore-end -->
 
-<!-- ALL-CONTRIBUTORS-LIST:END -->
+<!-- ALL-CONTRIBUTORS-LIST:END -->

package.json

@@ -20,7 +20,7 @@
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-router-dom": "^6.21.3",
-		"tailwind-merge": "^2.2.1"
+		"tailwind-merge": "^2.2.2"
 	},
 	"devDependencies": {
 		"@types/react": "^18.2.55",

src/components/FaqSection/faq.jsx

@@ -0,0 +1,50 @@
+import faqData from '../../config/content/faqData.js';
+import { PersonalizedText, Heading, Paragraph } from '../shared/index.js';
+
+function FAQ() {
+	const Header1 = faqData.Header1;
+	const Header2 = faqData.Header2;
+
+	return (
+		<div className='md:w-[76%] w-[92%] justify-items-center mt-[10px] mb-[44px] mx-auto'>
+			<div className='flex flex-col items-center justify-center mb-[40px]'>
+				<Heading
+					variant='h1'
+					style={{
+						color: '#F2DA05',
+						textShadow: '4.608px 4.608px 0px #000',
+						webkitTextStrokeWidth: '2.71052622795105',
+						webkitTextStrokeColor: '#252525',
+					}}>
+					{Header1}
+				</Heading>
+				<PersonalizedText style={{ color: 'var(--orange-dash, #FF4409)' }}>{Header2}</PersonalizedText>
+			</div>
+			<div className='flex flex-col items-start gap-[38px]'>
+				{faqData.questions.map(({ id, question, answer }) => (
+					<div className='flex flex-col justify-center gap-[10px]' key={id}>
+						<div className='flex gap-[10px] md:gap-[12px] flex-row'>
+							<img className='h-[32px] aspect-square' src={faqData.img.src} alt={faqData.img.alt} />
+							<Heading variant='h3'>{question}</Heading>
+						</div>
+						{answer instanceof Array ? (
+							<ul className='list-[square] px-7'>
+								{answer.map(({ key, content, bulleted }) => (
+									<li key={key} className={bulleted ? '' : 'list-none'}>
+										<Paragraph variant='body3'>{content}</Paragraph>
+									</li>
+								))}
+							</ul>
+						) : (
+							<Paragraph variant='body3' className='ml-[18]'>
+								{answer}
+							</Paragraph>
+						)}
+					</div>
+				))}
+			</div>
+		</div>
+	);
+}
+
+export default FAQ;