+
+ )
+}
+export default Login
\ No newline at end of file
diff --git a/src/Pages/SignUp.jsx b/src/Pages/SignUp.jsx
new file mode 100644
index 00000000..198e4789
--- /dev/null
+++ b/src/Pages/SignUp.jsx
@@ -0,0 +1,17 @@
+import "./Auth.css"
+import { Button } from "@mui/material"
+const SignUp = () =>{
+ return(
+
+
SignUp
+
+
+
+
+
+
+
+
+ )
+}
+export default SignUp
\ No newline at end of file
diff --git a/src/Pages/SingleQuestion.css b/src/Pages/SingleQuestion.css
new file mode 100644
index 00000000..19bd4397
--- /dev/null
+++ b/src/Pages/SingleQuestion.css
@@ -0,0 +1,5 @@
+main{
+ display: flex;
+ flex-basis: 0;
+ padding: 20px;
+}
diff --git a/src/Pages/SingleQuestion.jsx b/src/Pages/SingleQuestion.jsx
new file mode 100644
index 00000000..d4864371
--- /dev/null
+++ b/src/Pages/SingleQuestion.jsx
@@ -0,0 +1,32 @@
+import React from "react";
+import "./SingleQuestion.css"
+import { useLocation } from "react-router-dom";
+import QuesInfo from "../component/QuestionInfo";
+import CodeArea from "../component/CodeArea";
+
+function ProblemStatement(props) {
+ const loaction = useLocation()
+ const question = loaction.state.question
+ // console.log(typeof(question))
+
+ return (
+ //
Single Question
+
+
+
+
+
+ )
+ //
+ //
+ // {title}
+ //
+ //
+ // {acceptance}
+ //
+ //
+ // {difficulty}
+ //
+ //
+}
+export default ProblemStatement
\ No newline at end of file
diff --git a/src/assets/logo.avif b/src/assets/logo.avif
new file mode 100644
index 00000000..5badc946
Binary files /dev/null and b/src/assets/logo.avif differ
diff --git a/src/component/CodeArea.jsx b/src/component/CodeArea.jsx
new file mode 100644
index 00000000..a7110213
--- /dev/null
+++ b/src/component/CodeArea.jsx
@@ -0,0 +1,34 @@
+import InputLabel from '@mui/material/InputLabel';
+import MenuItem from '@mui/material/MenuItem';
+import FormControl from '@mui/material/FormControl';
+import Select from '@mui/material/Select';
+import { useState } from 'react';
+
+const CodeArea = ()=> {
+ const [language, setLanguage] = useState('C++');
+
+ const handleChange = (event) => {
+ setLanguage(event.target.value);
+ };
+
+ return (
+
+
+
+
+
+
+ );
+}
+export default CodeArea
\ No newline at end of file
diff --git a/src/component/NavBar.css b/src/component/NavBar.css
new file mode 100644
index 00000000..b06f1914
--- /dev/null
+++ b/src/component/NavBar.css
@@ -0,0 +1,18 @@
+.navbar{
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ flex-direction: row;
+ padding: 5px 20px;
+ /* background-color: #1d26c9; */
+ color: white;
+}
+.navlink{
+ padding: 0px 10px;
+ text-decoration: none;
+ /* color: white; */
+}
+.navbar img{
+ height: 50px;
+ border-radius: 50%;
+}
\ No newline at end of file
diff --git a/src/component/NavBar.jsx b/src/component/NavBar.jsx
new file mode 100644
index 00000000..9911c3ff
--- /dev/null
+++ b/src/component/NavBar.jsx
@@ -0,0 +1,21 @@
+import logo from "../assets/logo.avif"
+
+import { Outlet, NavLink } from "react-router-dom"
+// import './NavBar.css'
+const Navbar = () =>{
+ return(
+ <>
+
+
+
+ Problems
+ Login
+ Signup
+
+
+
+
+
+ )
+}
+export default Navbar
\ No newline at end of file
diff --git a/src/component/QuestionInfo.css b/src/component/QuestionInfo.css
new file mode 100644
index 00000000..842ebbf9
--- /dev/null
+++ b/src/component/QuestionInfo.css
@@ -0,0 +1,14 @@
+.question--cont{
+ margin-right: 10px;
+ line-height: 30px;
+}
+.examples{
+ /* padding: 50px 5px; */
+ border-radius: 10px;
+ display: flex;
+ flex-direction: column;
+ background-color: rgba(93, 111, 247, 0.3);
+}
+.examples>*{
+ padding: 15px 5px ;
+}
\ No newline at end of file
diff --git a/src/component/QuestionInfo.jsx b/src/component/QuestionInfo.jsx
new file mode 100644
index 00000000..2702eb98
--- /dev/null
+++ b/src/component/QuestionInfo.jsx
@@ -0,0 +1,17 @@
+// import "./QuestionInfo.css"
+const QuesInfo = (props) =>{
+ return(
+
+
{props.question.title}
+
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Distinctio, accusantium dolores optio reprehenderit, dolor nostrum ipsum suscipit molestias atque itaque quisquam? Necessitatibus nam tempora, voluptate aspernatur hic consequatur iste perferendis!
+ Deleniti illum praesentium, quasi assumenda, similique accusantium odio odit commodi natus fugiat quo voluptatibus nemo nesciunt repellat numquam facere. Nisi, iusto. Esse provident facere ipsum ad molestias atque officiis suscipit.
+
Example 1
+
+
Input: {props.question.input}
+
Output: {props.question.output}
+
Explanation: {props.question.explanation}
+
+
+ )
+}
+export default QuesInfo
\ No newline at end of file
diff --git a/src/component/QuestionRow.css b/src/component/QuestionRow.css
new file mode 100644
index 00000000..878b4b46
--- /dev/null
+++ b/src/component/QuestionRow.css
@@ -0,0 +1,7 @@
+/* .t--row{
+ margin: 80px;
+} */
+tr > td{
+ padding: 20px;
+ outline: none;
+}
\ No newline at end of file
diff --git a/src/component/QuestionRow.jsx b/src/component/QuestionRow.jsx
new file mode 100644
index 00000000..7fa93317
--- /dev/null
+++ b/src/component/QuestionRow.jsx
@@ -0,0 +1,22 @@
+import React from 'react'
+// import "./QuestionRow.css"
+import { useNavigate } from 'react-router-dom'
+const QuestionRow = (props)=>{
+ const id = props.question.id
+ const navigate = useNavigate()
+ const navigateToQues = (event) =>{
+ console.log(id)
+ navigate(`/problems/${id}`, {state:{question: props.question}})
+ }
+ return(
+
+
+