added constants to about and projects

changed footer styles

Author: aditya-mitra

Containers/About/constants.js

@@ -8,10 +8,11 @@
  * */
 export default {
     title: "Aditya Mitra",
-    subTitle: "Addicted to JS",
+    subTitle: "Working on JavaScript",
     description:
         `I am Aditya. A developer. I love to develop apps that are useful.
-         I am not an early developer. I did not start too young. I started with JS at age 18.`,
+         I am not an early developer. I did not start too young. I started with JS at age 18.
+         I like to build useful. apps with JavaScript.`,
     image: "/me.jpg",
     status: "hover here ",
 }

Containers/Projects/constants.js

@@ -2,8 +2,11 @@ import { GoMarkGithub } from 'react-icons/go';
 import { BiLink } from 'react-icons/bi';
 import { FaPenNib } from 'react-icons/fa';
 import { GrNode } from 'react-icons/gr';
-import { SiReact, SiNextDotJs, SiPostgresql, SiMongodb } from 'react-icons/si';
+import { SiReact, SiNextDotJs, SiPostgresql, SiMongodb, SiRedux, SiReactrouter,SiMarkdown } from 'react-icons/si';
 import { GrTechnology } from 'react-icons/gr';
+import {CgWebsite} from 'react-icons/cg';
+import {DiDjango} from 'react-icons/di';
+
 
 export const glossIcon = {
     // links
@@ -13,10 +16,19 @@ export const glossIcon = {
 
     // stacks
     "nodejs": GrNode,
+    "expressjs": GrNode,
     "reactjs": SiReact,
+    "redux": SiRedux,
     "nextjs": SiNextDotJs,
+    "react router": SiReactrouter,
+
+    "django": DiDjango,
     "postgresql": SiPostgresql,
     "mongodb": SiMongodb,
+
+    "website": CgWebsite,
+    "markdown": SiMarkdown,
+
     "other": GrTechnology,
 }
 
@@ -28,83 +40,100 @@ export const glossColour = {
 
     // stacks
     "nodejs": "orange",
+    "expressjs": "orange",
     "reactjs": "red",
+    "redux": "cyan",
     "nextjs": "cyan",
+    "react router": "purple",
+
+    "django": "purple",
     "postgresql": "blue",
     "mongodb": "teal",
+
+    "website": "yellow",
+    "markdown": "pink",
 }
 
 export default [
     {
         items: [
             {
-                title: "TextHand",
-                description: "It is a text to handwriting converter which generates images from text. I did my homework during the lockdown with the help of this app. It has not been caught till now. 😝"
+                title: "Code Rush",
+                description: "Code Rush is a competitive coding platform. It is open source coding platform supporting 6 coding languages.",
+                imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604304531/portfolio/Code%20Rush/cr-1_pd3aak.jpg"
+            },
+            {
+                title: "Code and solve questions",
+                description: "It is built on the latest standard of the web - the JAM Stack. It has an awesome ACE editor integrated into it. Live feedbacks on submissions are provided. Competitors can check their score on the leaderboard.",
+                imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604304530/portfolio/Code%20Rush/cr-2_ttkmqx.jpg"
             },
             {
-                title: "aka text-to-handwriting",
-                description: "Inspired from all the apps out there which me and my friends initially but none of us were satisfied. I built my own and added some `random` which made the generated image look more natural."
+                title: "Beat your competitors",
+                description: "There a lot of questions of all categories - easy, stacks, trickster, etc. An admin panel is also integrated in the backend of code rush. Live user count and comments for discussions are also enabled.",
+                imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604304531/portfolio/Code%20Rush/cr-3_mct9ev.jpg"
             },
         ],
         links: [
             {
                 provider: "github",
-                link: "https://github.com/uinstinct/TextHand",
+                link: "https://github.com/aditya-mitra/code-rush",
             },
             {
                 provider: "app",
-                link: "https://texthand-use-a.netlify.app/"
+                link: "https://code-rush.vercel.app/"
             }
         ],
-        stacks: ["nodejs", "reactjs",],
+        stacks: ["nextjs", "nodejs", "mongodb", "markdown",],
     },
     {
         items: [
             {
                 title: "Character Card Builder",
-                description: "Character Card Builder is an awesome app to build and display cards",
+                description: "Character Card Builder is a web app that lets you make awesome looking cards on the site.",
                 imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604062891/portfolio/Character%20Card%20Builder/CCB_create_1_hzcd34.png",
             },
             {
                 title: "Character Card Builder",
-                description: "You can try and build your own cards in the links given below",
-                imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604062660/portfolio/Character%20Card%20Builder/CCB_chars_2_w32zn9.png",
-            },
-            {
-                title: "Character Card Builder",
-                description: "It has even has awesome SEARCH feature and a fabolous DARK mode built integrated into it.",
+                description: "It has a ton of features such as an awesome SEARCH feature and a fabulous DARK mode built and integrated into it.",
                 imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604261385/portfolio/Character%20Card%20Builder/CCB_Search_3_wgxikr.jpg",
-            }
+            },
+            {
+                title: "Character Card Builder",
+                description: "It also has a LIVE card creator that lets you see the card you as soon as you type. It was my first project that utilized postgresql and redux.",
+                imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604062660/portfolio/Character%20Card%20Builder/CCB_chars_2_w32zn9.png",
+            },
+            
         ],
         links: [
             {
                 provider: "github",
-                link: "https://github.com"
+                link: "https://github.com/aditya-mitra/card_builder"
             },
             {
                 provider: "app",
-                link: "https://google.com"
+                link: "https://github.com/aditya-mitra/card_builder"
             }
         ],
-        stacks: ["nodejs", "reactjs", "postgresql"],
+        stacks: ["nodejs", "reactjs", "postgresql", "redux",],
     },
     {
         items: [
             {
                 title: "Whatster",
-                description: "WhatsTer is a Chat bot created using Twilio's Messaging API for Whatsapp. It is a based on a full stack",
+                description: "WhatsTer is a Chat bot created using Twilio's Messaging API for Whatsapp. If you would like to store messages from your chats in whatsapp itself, this bot can come very handy.",
                 imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604068045/portfolio/Whatster/Whatster_chats_1_dy9iv5.png",
             },
             {
                 title: "Whatster",
-                description: "This is really what someone needs to save their content.",
-                imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604067858/portfolio/Whatster/Whatster_website_og7dmd.png",
+                description: "It has a lot of features integrated into it. It has chat based mail service, image recognition, content saving feature all built to a single app, yet this bot is very simple to use.",
+                imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604067858/portfolio/Whatster/Whatster_login_lskciw.png",
             },
             {
                 title: "Whatster",
-                description: "It has chat based mail service, image recognition, content saving feature all built to a single app, yet simple to use.",
-                imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604067858/portfolio/Whatster/Whatster_login_lskciw.png",
+                description: "Whatster will save your messages on its database and let you secure them with your account. It will send you an OTP for you to login into its webapp.",
+                imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604067858/portfolio/Whatster/Whatster_website_og7dmd.png",
             },
+            
         ],
         links: [
             {
@@ -120,6 +149,32 @@ export default [
                 link: "https://dev.to/adityamitra/whatster-the-chatbot-i-built-for-twilio-9ok",
             }
         ],
-        stacks: ["nodejs", "reactjs", "twilio", "mongodb"],
-    }
+        stacks: ["expressjs", "reactjs", "twilio", "mongodb",  "react router"],
+    },
+    {
+        items: [
+            {
+                title: "Socio Students",
+                description: "A web application created for students to get social and know each other better.",
+                imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604307197/portfolio/Socio%20Students/ssw-1-min_hfolhp.png",
+            },
+            {
+                title: "Socio Students",
+                description: "Students can view others profile and edit or delete their profiles. It is a website built with django",
+                imgSrc: "https://res.cloudinary.com/gamersinstinct7/image/upload/v1604306984/portfolio/Socio%20Students/ssw-2_iwys6k.png",
+            },
+        ],
+        links: [
+            {
+                provider: "github",
+                link: "https://github.com/uinstinct/socioStudentWin",
+            },
+            {
+                provider: "app",
+                link: "https://djangoaditya.pythonanywhere.com/",
+            },
+        ],
+        stacks: ["django","website"],
+    },
+
 ];

styles/footer.js

@@ -12,7 +12,7 @@ const allStyles = css`
   color: black;
   overflow: hidden;
 }
-@media screen and (max-width: 350px) {
+@media screen and (max-width: 590px) {
   .footer {
     height: 22.5rem;
     grid-template-columns: 1fr;
@@ -80,7 +80,6 @@ const allStyles = css`
 @media screen and (max-width: 350px) {
   .built-with {
     margin: 1.5rem 0;
-    font-size: 1.5em;
   }
 }
 .built-with .border{
@@ -91,6 +90,11 @@ const allStyles = css`
   border-left: 1px solid black;
   opacity: 0.5;
 }
+@media screen and (max-width: 590px){
+  .built-with .border{
+    display: none;
+  }
+}
 .built-with span{
   font-weight: 200;
   display: inline;
@@ -99,7 +103,7 @@ const allStyles = css`
   display: block;
   margin: 1rem;
 }
-@media screen and (max-width: 450px){
+@media screen and (max-width: 590px){
   .built-with .built{
     margin: 0 1rem;
   }