diff --git a/src/App.tsx b/src/App.tsx
index f70283c..5425c12 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -9,8 +9,7 @@ import { queryIsEmpty } from './components/navigation/Navbar/utils';
import SubjectList from './views/SubjectList';
import { ILoadingState, IFilterQuery } from './types';
import NothingFound from './views/NothingFound';
-import UploadForm from './views/Admin/UploadForm';
-import LogInForm from './views/Admin/LogInForm';
+import Admin from './views/Admin';
const useDidUpdate: typeof useEffect = (func, dependencies) => {
const didMountRef = useRef(false);
@@ -72,15 +71,8 @@ const App = () => {
setLoading={setLoading}
/>
-
-
-
-
-
+
+
diff --git a/src/components/navigation/Header/utils.ts b/src/components/navigation/Header/utils.ts
index 43201ea..1d5b50c 100644
--- a/src/components/navigation/Header/utils.ts
+++ b/src/components/navigation/Header/utils.ts
@@ -9,11 +9,11 @@ const genName = (
return error.toString();
}
- if (path === '/u') {
+ if (path === '/a/u') {
return 'Upload form';
}
- if (path === '/l') {
+ if (path === '/a/l') {
return 'login';
}
diff --git a/src/components/navigation/Navbar/main.css b/src/components/navigation/Navbar/main.css
index f53458e..69532fd 100644
--- a/src/components/navigation/Navbar/main.css
+++ b/src/components/navigation/Navbar/main.css
@@ -87,6 +87,7 @@
height: 6vh;
border-radius: 20px;
width: 75vw;
+ color: rgb(54, 54, 69);
font-size: 2.5vh;
}
diff --git a/src/views/Admin/LogInForm/index.tsx b/src/views/Admin/LogInForm/index.tsx
index e9a7086..e7dcab8 100644
--- a/src/views/Admin/LogInForm/index.tsx
+++ b/src/views/Admin/LogInForm/index.tsx
@@ -1,8 +1,10 @@
import React, { Dispatch, SetStateAction, useEffect } from 'react';
import { useHistory } from 'react-router-dom';
+
import { ILoadingState } from '../../../types';
import { handleFormSubmit } from '../../../utils';
import { handleSuccessfulLogin } from './handlers';
+import './main.css';
type props = {
setLoading: Dispatch>;
@@ -16,14 +18,17 @@ const LogInForm: React.FC = ({ setLoading, token, setToken }) => {
useEffect(() => {
setLoading({ fetching: false, error: '' });
if (token) {
- historyPush('/u');
+ historyPush('/a/u');
}
}, [setLoading, historyPush, token]);
return (
);
};
diff --git a/src/views/Admin/UploadForm/main.css b/src/views/Admin/UploadForm/main.css
index e69de29..020147e 100644
--- a/src/views/Admin/UploadForm/main.css
+++ b/src/views/Admin/UploadForm/main.css
@@ -0,0 +1,28 @@
+#uploadForm {
+ padding: 2vh;
+ display: flex;
+ flex-direction: column;
+}
+
+#uploadForm>input,
+#uploadForm>select,
+#uploadForm>aside {
+ height: 6vh;
+ border: none;
+ border-radius: 1000px;
+ box-sizing: border-box;
+ padding: 0 2vh;
+ appearance: none;
+ width: 100%;
+ background-color: white;
+ margin: 1vh 0;
+ color: inherit;
+}
+
+#uploadForm aside {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+#uploadFrom input[type='file'] {}
\ No newline at end of file
diff --git a/src/views/Admin/index.tsx b/src/views/Admin/index.tsx
index e3351c4..06b2993 100644
--- a/src/views/Admin/index.tsx
+++ b/src/views/Admin/index.tsx
@@ -1,7 +1,66 @@
-import React from 'react';
+import React, { Dispatch, SetStateAction, useEffect } from 'react';
+import { Link, Redirect, Route, Switch, useRouteMatch } from 'react-router-dom';
-const Admin: React.FC = () => {
- return ;
+import { ILoadingState } from '../../types';
+import LogInForm from './LogInForm';
+import UploadForm from './UploadForm';
+import './main.css';
+
+type props = {
+ token: string | null;
+ setToken: Dispatch>;
+ setLoading: Dispatch>;
+};
+
+const Admin: React.FC = ({ token, setToken, setLoading }) => {
+ const { path, url } = useRouteMatch();
+
+ useEffect(() => {
+ setLoading({ fetching: false, error: '' });
+ }, [setLoading]);
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
};
export default Admin;
diff --git a/src/views/Admin/main.css b/src/views/Admin/main.css
index e69de29..69d34c8 100644
--- a/src/views/Admin/main.css
+++ b/src/views/Admin/main.css
@@ -0,0 +1,52 @@
+#admin {
+ min-height: calc(79.5vh + 20px);
+ height: 100%;
+}
+
+#admin nav {
+ background-color: white;
+ padding: 2vh;
+ padding-top: calc(20px + 0.75vh);
+ margin-top: -20px;
+ border-radius: 0 0 20px 20px;
+ height: 16vmax;
+ position: relative;
+}
+
+#admin nav ul {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ flex-wrap: wrap;
+ justify-content: space-around;
+}
+
+#admin nav li {
+ list-style-type: none;
+}
+
+#admin nav li a {
+ color: rgb(255, 109, 109);
+ border-bottom: 1px solid rgb(255, 109, 109);
+}
+
+#admin nav li a,
+#admin nav #logSwitch a {
+ text-decoration: none;
+}
+
+#admin nav #logSwitch {
+ position: absolute;
+ background-color: rgb(255, 109, 109);
+ border: none;
+ padding: 1.5vh;
+ height: 6vh;
+ border-radius: 20px;
+ font-size: 2.5vh;
+ right: 2vh;
+ top: calc((16vmax + 20px - 6vh) / 2);
+}
+
+#admin nav #logSwitch a {
+ color: white;
+}
\ No newline at end of file