Mentors page setup

winterofcode · Nov 21, 2020 · ca6b526 · ca6b526 · vercel · Nov 21, 2020
1 parent 46ad81e
commit ca6b526
Show file tree

Hide file tree

Showing 7 changed files with 41 additions and 23 deletions.
diff --git a/public/index.html b/public/index.html
@@ -7,9 +7,9 @@
     <meta name="theme-color" content="#000000" />
     <meta
       name="description"
-      content="Web site created using create-react-app"
+      content="Winter of Code is a program aimed to increase participation for the Google Summer of Code program among students in colleges and universities."
     />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/org-logo.png" />
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/

diff --git a/public/manifest.json b/public/manifest.json
@@ -1,19 +1,19 @@
 {
-  "short_name": "React App",
-  "name": "Create React App Sample",
+  "short_name": "Winter of Code",
+  "name": "Winter of Code",
   "icons": [
     {
-      "src": "favicon.ico",
+      "src": "org-logo.png",
       "sizes": "64x64 32x32 24x24 16x16",
       "type": "image/x-icon"
     },
     {
-      "src": "logo192.png",
+      "src": "org-logo.png",
       "type": "image/png",
       "sizes": "192x192"
     },
     {
-      "src": "logo512.png",
+      "src": "org-logo.png",
       "type": "image/png",
       "sizes": "512x512"
     }

diff --git a/src/Components/ProfileCard/ProfileCard.js b/src/Components/ProfileCard/ProfileCard.js
@@ -3,22 +3,20 @@ import "./ProfileCard.scss"
 
 export default ({src, username, userphoto, title, description, organisationLogo, organisationName }) => {
     return (
-        <div className="review">
+        <div className="profile">
         <div className="pos">
         <div className="image-container">
-        <img src={userphoto} alt="Reviewer" className="image" />
+        <img src={userphoto} alt={username} className="image" />
         </div>
         <h3 className="username">{username}</h3>
         </div>
 
-        <div className="review-content">
-        <h2 className="review-title">{title}</h2>
-        <p className="review-text">{description}</p>
-        <div className="review-organisation">
-        <div className="review-organisation-img-container">
-        <img src={organisationLogo} className="image" alt="organisation-name" />
-        </div>
-        <p className="review-organisation-name">{organisationName}</p>
+        <div className="profile-content">
+        <h2 className="profile-title">{title}</h2>
+        <p className="profile-text">{description}</p>
+        <div className="profile-organisation">
+
+        <p className="profile-organisation-name">{organisationName}</p>
         </div>
         </div>
         </div>

diff --git a/src/Components/ProfileCard/ProfileCard.scss b/src/Components/ProfileCard/ProfileCard.scss
@@ -1,4 +1,4 @@
-.review {
+.profile {
     height: 250px;
     box-shadow: 0 1rem 3rem rgba(0,0,0,0.15);
     width: 500px;
@@ -29,7 +29,7 @@
     object-fit: cover;
 }
 
-.review-content {
+.profile-content {
     margin-left: 28rem;
     padding: 2rem 2rem 2rem 0;
     text-align: left;
@@ -73,7 +73,7 @@
     // }
 }
 
-.review {
+.profile {
     &-title {
         margin-bottom: 1rem;
         font-size: 1.6rem;

diff --git a/src/Components/Router.js b/src/Components/Router.js
@@ -15,7 +15,7 @@ import EduAlgo from "../Routes/EduAlgo";
 import AbsurdNerd from "../Routes/AbsurdNerd";
 import CanvasBird from "../Routes/CanvasBird";
 import FireShort from "../Routes/FireShot";
-// import MentorsPage from "../Routes/MentorsPage";
+import MentorsPage from "../Routes/MentorsPage";
 import TesseractCoding from "../Routes/TesseractCoding";
 import DscX from "../Routes/DscX";
 import Dynopii from "../Routes/Dynopii";
@@ -40,7 +40,7 @@ const AppRouter = () => (
     <ScrollToTop />
     <Switch>
       <Route exact={true} path="/" component={HomePage} />
-      {/* <Route path="/mentors" component={MentorsPage} /> */}
+       <Route path="/mentors" component={MentorsPage} /> 
       <Route path="/organisation/deep-fusion-ai" component={DeepFusionAI} />
       <Route path="/organisation/absurd-nerd" component={AbsurdNerd} />
       <Route path="/organisation/edualgo" component={EduAlgo} />

diff --git a/src/Components/Tag.js b/src/Components/Tag.js
@@ -0,0 +1,19 @@
+import React from "react";
+import styled from "styled-components"
+
+const TagStyles = styled.div`
+    margin-right: 10px;
+    padding: 0.125rem 0.5rem;
+    background-color: #e2e8f0;
+    border-radius: 0.125rem;
+    box-shadow: 0rem 0.7rem 1.4rem rgba(0,0,0,0.07);
+    font-size: 1rem;
+    font-weight: 500;
+    color: #4a5568;
+` 
+
+const Tag = ({ text }) => (
+  <TagStyles>{text}</TagStyles>
+);
+
+export default Tag;
diff --git a/src/Routes/MentorsPage.js b/src/Routes/MentorsPage.js
@@ -19,7 +19,8 @@ const Mentor = [
     {
       username: "Vishwajeet Raj",
       userphoto: require("../Assets/me.jpg"),
-      title: "Awesome",
+      title: "EduAlgo",
+      tag: ['eduAlgo', 'AI | ML'],
       description: "It was an amazing Experienc as usual. I liked it to the best of day and all. thanks for reading.",
       organisationLogo: require("../Assets/org-logo.png"),
       organisationName: "Winter of Code",