Merge branch 'main' into test

.github/ISSUE_TEMPLATE/bug.yml

@@ -0,0 +1,26 @@
+  name: "🐞 Bug Report"
+  description: "Create a report to help us improve"
+  title: "BUG:"
+  labels: ["Bug"]
+  body:
+    - type: checkboxes
+      attributes:
+        label: "Is there an existing issue for this?"
+        description: "Please search to see if an issue already exists for the bug you encountered."
+        options:
+          - label: "I have searched the existing issues"
+            required: true
+    - type: textarea
+      attributes:
+        label: "What went down?"
+        description: "A concise description of what you're experiencing."
+      validations:
+        required: true
+    - type: checkboxes
+      attributes:
+        label: "Record"
+        options:
+          - label: "I agree to follow this project's Code of Conduct"
+            required: true
+          - label: "I'm a GSSOC'24 contributor"
+          - label: "I want to work on this issue"

.github/ISSUE_TEMPLATE/documentation.yml

@@ -0,0 +1,26 @@
+name: "📑 Documentation Update"
+description: "Improve Documentation"
+title: "DOC:"
+labels: [DOC, Needs Triage]
+body:
+  - type: textarea
+    attributes:
+      label: "What's wrong with the existing documentation"
+      description: "Which things do we need to add or delete"
+    validations:
+      required: true
+  - type: textarea
+    attributes:
+      label: "Add ScreenShots"
+      description: "Add sufficient SS to explain your issue."
+    validations:
+      required: false
+
+  - type: checkboxes
+    attributes:
+      label: "Record"
+      options:
+        - label: "I agree to follow this project's Code of Conduct"
+          required: true
+        - label: "I'm a GSSOC'24 contributor"
+        - label: "I want to work on this issue"

.github/ISSUE_TEMPLATE/feature.yml

@@ -0,0 +1,25 @@
+name: "✨ Feature Request"
+description: "Suggest an idea for this project "
+title: "Feat:"
+labels: [Feat, Needs Triage]
+body:
+  - type: textarea
+    attributes:
+      label: "Describe the feature"
+      description:
+    validations:
+      required: true
+  - type: textarea
+    attributes:
+      label: "Add ScreenShots"
+      description: "Add sufficient SS to explain your issue."
+    validations:
+      required: true
+  - type: checkboxes
+    attributes:
+      label: "Record"
+      options:
+        - label: "I agree to follow this project's Code of Conduct"
+          required: true
+        - label: "I'm a GSSOC'24 contributor"
+        - label: "I want to work on this issue"

branchupdate.sh

@@ -0,0 +1,18 @@
+Make Sure that your branch is up to date with the master branch(remotely) before you push your code to the remote repository.
+
+```bash
+#!/bin/bash
+# This script will update your branch with the master branch
+# Make sure that you are in the branch that you want to update
+# Usage: ./branchupdate.sh
+git checkout master/main
+git pull
+git checkout {your-branch-name}
+git merge master/main
+```
+
+Follow the above steps to create a script file and run the script file to update your branch with the master branch.
+You can either directly use these steps in terminal for branch update or create a script file for the same.
+Make sure that you are in the branch that you want to update before running the script file.
+This is a simple script that will update your branch with the master branch. You can modify the script according to your requirements.
+Hope this helps.

package.json

@@ -11,7 +11,7 @@
     "@fortawesome/fontawesome-svg-core": "^6.5.2",
     "@fortawesome/free-solid-svg-icons": "^6.5.2",
     "@fortawesome/react-fontawesome": "^0.2.2",
-    "@mui/icons-material": "^5.15.19",
+    "@mui/icons-material": "^5.15.20",
     "@react-oauth/google": "^0.12.1",
     "@testing-library/jest-dom": "^6.4.6",
     "@testing-library/react": "^11.1.0",

src/App.js

@@ -15,6 +15,7 @@ import Pricing from "./Components/footer_section/Pricing/pricing";
 import MyProjects from "./Components/menu_section/my_projects/MyProjects";
 import NewProject from "./Components/menu_section/new_project/NewProject";
 import Error from "./Components/404_page/Error";
+import Profiles from "./Components/Profiles";
 import Profile from "./Components/Profile/profile";
 import Licensing from "./Components/footer_section/Legal/Licensing";
 import TermsConditions from "./Components/footer_section/Legal/TermsandConditions";
@@ -43,6 +44,7 @@ function App() {
           <Route path="/licensing" element={<Licensing />} />
 
           <Route path="/readmore/:id" element={<Readmore/>}/>
+          <Route path="/profile/:id" element={<Profiles/>}/>
 
           <Route path="/pricing" element={<Pricing />} />
           <Route path="/projects" element={<MyProjects />} />

src/Components/CardMain.js

@@ -65,7 +65,7 @@ function CardMain({ imgSrc, title, hearts }) {
         onMouseOver={() => handleMouseOver(index)}
         onMouseOut={() => handleMouseOut(index)}
       >
-            Abc
+            {project.dev}
           </p>
         </div>
       </div>
@@ -83,22 +83,22 @@ function CardMain({ imgSrc, title, hearts }) {
       onMouseOut={() => handleMouseOut(index)}
     >
         <div className="heading">
-          <div className="dp"></div>
+          <img width={40} src={project.pro} alt="" />
           <div className="details1">
-            <p id="name">@Abc</p>
-            <p id="occupation">Web Designer, Video Editor</p>
+            <p id="name">@{project.dev}</p>
+            <p id="occupation">{project.role}</p>
           </div>
         </div>
         <div className="details2">
           <p id="info">
-            I'm a versatile professional skilled in web development and video
-            editing, creating seamless online experiences and high-quality
-            multimedia content.
+            {project.about}
           </p>
         </div>
         <div className="btnnn">
           <button>Follow Me</button>
-          <button>View Profile</button>
+          <button><Link to={`/profile/${project.id}`}>
+          View Profile
+        </Link></button>
         </div>
       </div>
       </div>

src/Components/Profile.css

@@ -0,0 +1,80 @@
+.p-page{
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: center;
+    width: 100%;
+}
+.p-page .arrow{
+    position: fixed;
+    top: 0;
+    left: 0;
+    padding: 10px;
+    width: 90px;
+}
+.profile{
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    margin: 100px;
+    padding: 30px 50px;
+    font-family: sans-serif;
+    border: 1px solid whitesmoke;
+    border-radius: 10px;
+    width: 80%;
+}
+.head{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+.profile .icon{
+    width: 240px;
+    height: 250px;
+}
+.profile .head-text{
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    padding: 20px 10px 20px 50px;
+    line-height: 30px;
+}
+.head-text .dev{
+    font-size: 2.7rem;
+    font-weight: 700;
+}
+.head-text .role{
+    font-size: 1.7rem;
+    padding-top: 10px;
+}
+.head-text .btn{
+    padding: 12px 24px;
+    font-size: medium;
+    font-weight: 550;
+    background-color: rgb(67, 93, 238);
+    width: fit-content;
+}
+.head-text button:hover{
+    background-color: rgb(0, 47, 255);
+}
+.profile .about{
+    font-size: 1.2rem;
+    padding: 30px 0px;
+}
+@media (max-width:870px) {
+    .profile{
+        padding: 30px 10px;
+    }
+    .profile .head{
+        display: flex;
+        flex-direction: column;
+    }
+    .profile .head-text{
+        padding: 30px;
+    }
+}
+@media (max-width:425px) {
+    .profile{
+        padding: 10px;
+    }
+}