Merge branch 'main' of github.com:AswinBarath/ju-query

Author: AswinBarath

.eslintcache

@@ -1,12 +1,16 @@
 import React, { useEffect } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { Switch, Route } from 'react-router-dom';
+
 import { login, logout, selectUser } from './features/userSlice';
 import { auth } from './firebase';
-import HomePage from './pages/homepage/HomePage';
+
 import Login from './components/auth/Login';
+import HomePage from './pages/homepage/HomePage';
+import Following from './pages/followingpage/FollowingPage';
+import Questions from './pages/questionpage/QuestionsPage';
+
 import './App.css';
-import Following from './pages/followingpage/Following';
 
 function App() {
   const user = useSelector(selectUser);
@@ -44,6 +48,7 @@ function App() {
               <Switch>
                 <Route exact={true} path='/' component={HomePage} />
                 <Route exact path='/following' component={Following} />
+                <Route exact path='/question' component={Questions} />
               </Switch>
             </div>
           ) 

src/App.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import QuestionOptions from './QuestionOptions';
+import './Question.css';
+
+function Question() {
+    return (
+        <div className = "sidebar">
+            <QuestionOptions />
+        </div>
+    )
+}
+
+export default Question;

src/components/sidebar/Question.css

@@ -0,0 +1,28 @@
+import React from 'react';
+import './QuestionOptions.css';
+
+function QuestionOptions() {
+    return (
+        <div>
+            <div className="options">
+                <div className="heading">
+                    <strong>Questions</strong>
+                </div>
+                <div className="option">
+                    <img src="https://qphs.fs.quoracdn.net/main-thumb-t-2177-100-JiR07D1TQSfeQzRvWXomVaY4Poj2f8Yb.jpeg"  alt="Tech" />
+                    <p>Questions for you</p>
+                </div>
+                <div className="option">
+                    <img src="https://qphs.fs.quoracdn.net/main-thumb-t-18797-100-B7cd2Zkrhke1Bd3yn2Vq0HIwXIVg0JaW.jpeg" alt="Events" />
+                    <p>Answer requests</p>
+                </div>
+                <div className="option">
+                    <img src="https://qphs.fs.quoracdn.net/main-thumb-t-3906-100-3WJwKe2alb83spIH7rfECXY49noETA9x.jpeg"  alt="innovation" />
+                    <p>Answer Drafts</p>
+                </div>
+            </div>
+        </div>
+    )
+}
+
+export default QuestionOptions;

src/components/sidebar/Question.js

@@ -0,0 +1,5 @@
+.Following__content {
+    display: flex;
+    justify-content: center;
+    margin-top: 50px;
+}

src/components/sidebar/QuestionOptions.css

@@ -0,0 +1,19 @@
+import React from 'react';
+import Navbar from '../../components/navbar/Navbar';
+import Sidebar from '../../components/sidebar/Sidebar';
+import Feed from '../../components/post/Feed';
+import './FollowingPage.css';
+
+function FollowingPage() {
+    return (
+        <div className="home">
+           <Navbar /> 
+           <div className="Following__content">
+              <Sidebar />
+              <Feed />
+           </div>
+        </div>
+    )
+}
+
+export default FollowingPage;

src/components/sidebar/QuestionOptions.js

@@ -0,0 +1,5 @@
+.Questions__content {
+    display: flex;
+    justify-content: center;
+    margin-top: 50px;
+}

src/pages/followingpage/FollowingPage.css

@@ -0,0 +1,19 @@
+import React from 'react';
+import Navbar from '../../components/navbar/Navbar';
+import Question from '../../components/sidebar/Question';
+import Feed from '../../components/post/Feed';
+import './QuestionsPage.css';
+
+function QuestionsPage() {
+    return (
+        <div className="home">
+           <Navbar /> 
+           <div className="Questions__content">
+              <Question />
+              <Feed />
+           </div>
+        </div>
+    )
+}
+
+export default QuestionsPage;