From 764654a9b75f5e3b7d101ed6247b36e3845c7f04 Mon Sep 17 00:00:00 2001 From: lucywalt Date: Wed, 2 Apr 2025 00:50:24 -0700 Subject: [PATCH 1/4] Updated admin panel css --- frontend/react-app/src/css/AdminPanel.css | 51 ++++++++++++++++++++- frontend/react-app/src/pages/AdminPanel.jsx | 2 +- 2 files changed, 51 insertions(+), 2 deletions(-) diff --git a/frontend/react-app/src/css/AdminPanel.css b/frontend/react-app/src/css/AdminPanel.css index b341f97..a48c02f 100644 --- a/frontend/react-app/src/css/AdminPanel.css +++ b/frontend/react-app/src/css/AdminPanel.css @@ -3,5 +3,54 @@ margin: 4% 0; } .buttonRow{ - margin: 2% 0; + display: flex; + flex-direction: row; + justify-content: center; + background-color: #e6e4f7; + width: 60%; + border-radius: 25px; + margin-top: 2%; +} + +#adminHeader { + font-weight: 1000; + margin-top: 2%; + font-size: 2em; +} + +.buttonRow a button { + background-color: #53789d; + color: white; + font-size: 1.25em; + width: 175px; + height: 66px; +} + +.buttonRow a button:hover { + background-color: #3d6285; +} + +.goToTeamTaskForm { + width: 75%; + margin-left: 21%; + margin-right: 20%; +} + +.goToTeamTaskForm input { + background-color: #4f407d; + border-radius: 15px; + font-size: 1em; + border-radius: 10px; +} + +.goToTeamTaskForm input:hover { + cursor: pointer; + background-color: #2d2644; +} + +.goToTeamTaskForm select { + width: 50%; + background-color: #d3d4f9; + margin-right: 20px; + border-radius: 15px; } \ No newline at end of file diff --git a/frontend/react-app/src/pages/AdminPanel.jsx b/frontend/react-app/src/pages/AdminPanel.jsx index 5c3f14d..83d6ddd 100644 --- a/frontend/react-app/src/pages/AdminPanel.jsx +++ b/frontend/react-app/src/pages/AdminPanel.jsx @@ -44,7 +44,7 @@ export default function AdminPanel(){
-
Admin Controls
+
Admin Controls
From d02d85c44db3786471ae1db9162c8c1e48544959 Mon Sep 17 00:00:00 2001 From: lucywalt Date: Wed, 2 Apr 2025 01:14:17 -0700 Subject: [PATCH 2/4] Updated css for admin create account --- .../src/components/CreateAccountForm.jsx | 9 ++++--- frontend/react-app/src/css/AdminPanel.css | 2 +- frontend/react-app/src/css/CreateAccount.css | 24 +++++++++++-------- 3 files changed, 19 insertions(+), 16 deletions(-) diff --git a/frontend/react-app/src/components/CreateAccountForm.jsx b/frontend/react-app/src/components/CreateAccountForm.jsx index 8de3950..37a93c8 100644 --- a/frontend/react-app/src/components/CreateAccountForm.jsx +++ b/frontend/react-app/src/components/CreateAccountForm.jsx @@ -45,15 +45,14 @@ export default function CreateAccountForm({teams}){ const customStyles = { control: (provided) => ({ ...provided, - width: '65vw', + width: '420px', minWidth: '100px', - maxWidth: '100%', minHeight: '30px', - maxHeight: '100%', - border: '2px solid grey', + // maxHeight: '100%', + border: '1.5px solid #2d2644;', borderRadius: '10px', paddingLeft: '8px', - backgroundColor: '#BFCDE0', + backgroundColor: 'white', margin: '10px 0px', }), }; diff --git a/frontend/react-app/src/css/AdminPanel.css b/frontend/react-app/src/css/AdminPanel.css index a48c02f..72cc450 100644 --- a/frontend/react-app/src/css/AdminPanel.css +++ b/frontend/react-app/src/css/AdminPanel.css @@ -50,7 +50,7 @@ .goToTeamTaskForm select { width: 50%; - background-color: #d3d4f9; + background-color: #e6e4f7; margin-right: 20px; border-radius: 15px; } \ No newline at end of file diff --git a/frontend/react-app/src/css/CreateAccount.css b/frontend/react-app/src/css/CreateAccount.css index 82e299f..a93877a 100644 --- a/frontend/react-app/src/css/CreateAccount.css +++ b/frontend/react-app/src/css/CreateAccount.css @@ -15,34 +15,36 @@ height: 100%; justify-content: center; font-family: Arial, Helvetica, sans-serif; - background-color: #BFCDE0; + background-color: #e6e4f7; border: none; - border-radius: 10px; + border-radius: 15px; + margin: 3% 10% 10% 12%; + width: 75%; } #createAccountForm select{ - width: 65vw; + width: 50%; min-width: 100px; max-width: 100%; min-height: 30px; max-height: 100%; - border: 2px solid grey; + border: 1.5px solid #2d2644; border-radius: 10px; padding-left: 8px; - background-color: #BFCDE0; + background-color: white; margin: 10px 0px; } #createAccountForm input { - width: 65vw; + width: 50%; height: 7vh; min-width: 100px; max-width: 100%; min-height: 30px; max-height: 100%; - border: 2px solid grey; + border: 1.5px solid #2d2644; border-radius: 10px; padding-left: 8px; - background-color: #BFCDE0; + background-color: white; margin: 10px 0px; } @@ -53,17 +55,19 @@ #createAccountForm button { width: 100px; - height: 30px; + height: 40px; font-size: 1em; margin-top: 20px; margin-bottom: 20px; border: none; border-radius: 10px; color: white; + font-size: 1.12em; background-color: #3f5d8b; } #createAccountForm button:hover { cursor: pointer; background-color: #2f486d; -} \ No newline at end of file +} + From 214119f7551a51e0d892e40f3557c62124fae430 Mon Sep 17 00:00:00 2001 From: lucywalt Date: Wed, 2 Apr 2025 01:27:27 -0700 Subject: [PATCH 3/4] Updated css for admin create team --- frontend/react-app/src/components/CreateTeamForm.jsx | 10 +++++----- frontend/react-app/src/css/AdminPanel.css | 5 +++-- frontend/react-app/src/css/CreateAccount.css | 9 +++++---- 3 files changed, 13 insertions(+), 11 deletions(-) diff --git a/frontend/react-app/src/components/CreateTeamForm.jsx b/frontend/react-app/src/components/CreateTeamForm.jsx index 6907e07..fcc8c05 100644 --- a/frontend/react-app/src/components/CreateTeamForm.jsx +++ b/frontend/react-app/src/components/CreateTeamForm.jsx @@ -22,22 +22,22 @@ export default function CreateTeamForm({users}){ const customStyles = { control: (provided) => ({ ...provided, - width: '65vw', + width: '420px', minWidth: '100px', maxWidth: '100%', minHeight: '30px', maxHeight: '100%', - border: '2px solid grey', + border: '1.5px solid #2d2644', borderRadius: '10px', paddingLeft: '8px', - backgroundColor: '#BFCDE0', + backgroundColor: 'white', margin: '10px 0px', }), }; return(
- + )} /> - + ) } \ No newline at end of file diff --git a/frontend/react-app/src/css/AdminPanel.css b/frontend/react-app/src/css/AdminPanel.css index 72cc450..73772aa 100644 --- a/frontend/react-app/src/css/AdminPanel.css +++ b/frontend/react-app/src/css/AdminPanel.css @@ -50,7 +50,8 @@ .goToTeamTaskForm select { width: 50%; - background-color: #e6e4f7; + background-color: #d3d4f9; margin-right: 20px; border-radius: 15px; -} \ No newline at end of file +} + diff --git a/frontend/react-app/src/css/CreateAccount.css b/frontend/react-app/src/css/CreateAccount.css index a93877a..50abc55 100644 --- a/frontend/react-app/src/css/CreateAccount.css +++ b/frontend/react-app/src/css/CreateAccount.css @@ -18,7 +18,7 @@ background-color: #e6e4f7; border: none; border-radius: 15px; - margin: 3% 10% 10% 12%; + margin: 3% 10% 3% 12%; width: 75%; } @@ -54,9 +54,10 @@ } #createAccountForm button { - width: 100px; - height: 40px; - font-size: 1em; + width: 120px; + height: 50px; + font-size: 0.75em; + padding: 1%; margin-top: 20px; margin-bottom: 20px; border: none; From d711527a39ef22d00c92704a1f4464d6738cc8ad Mon Sep 17 00:00:00 2001 From: lucywalt Date: Wed, 2 Apr 2025 01:55:02 -0700 Subject: [PATCH 4/4] updated css for delete edit users --- .../react-app/src/components/UserTable.jsx | 7 ++-- frontend/react-app/src/css/AdminAllUsers.css | 8 +++++ frontend/react-app/src/css/UserTable.css | 33 +++++++++++++++++++ 3 files changed, 45 insertions(+), 3 deletions(-) create mode 100644 frontend/react-app/src/css/UserTable.css diff --git a/frontend/react-app/src/components/UserTable.jsx b/frontend/react-app/src/components/UserTable.jsx index 338ff15..43a99de 100644 --- a/frontend/react-app/src/components/UserTable.jsx +++ b/frontend/react-app/src/components/UserTable.jsx @@ -1,6 +1,7 @@ import {useTable, useSortBy} from 'react-table' import React, { useEffect } from 'react'; -import "../css/TaskList.css" +import "../css/TaskList.css"; +import "../css/UserTable.css"; import SearchFilterSort from './SearchFilterSort'; import { useState} from 'react'; import { getTeamMembers } from '../api/teamApi'; @@ -163,7 +164,7 @@ function UserTable({teams}){ Header: "", accessor: "del", Cell: (original) => ( - ) @@ -173,7 +174,7 @@ function UserTable({teams}){ accessor: "edit", Cell: (original) => ( - diff --git a/frontend/react-app/src/css/AdminAllUsers.css b/frontend/react-app/src/css/AdminAllUsers.css index 1c23560..886ab76 100644 --- a/frontend/react-app/src/css/AdminAllUsers.css +++ b/frontend/react-app/src/css/AdminAllUsers.css @@ -5,4 +5,12 @@ } .container{ height: 50%; +} + +#searchThis { + background-color: #d3d4f9; + color: black; + border-radius: 10px; + margin: 3% 0%; + border: 1px solid black; } \ No newline at end of file diff --git a/frontend/react-app/src/css/UserTable.css b/frontend/react-app/src/css/UserTable.css new file mode 100644 index 0000000..950ac4a --- /dev/null +++ b/frontend/react-app/src/css/UserTable.css @@ -0,0 +1,33 @@ +.search-form input { + background-color: #d3d4f9; + color: black; + border: 1px solid black; +} + +.userEditBtn { + width: 65px; + height: 30px; + background-color: darkgreen; + border: none; + border-radius: 5px; + color: white; +} + +.userEditBtn:hover { + cursor: pointer; + background-color: #004f07; +} + +.userDeleteBtn { + width: 65px; + height: 30px; + background-color: #bf003e; + border: none; + border-radius: 5px; + color: white; +} + +.userDeleteBtn:hover { + cursor: pointer; + background-color: #8c002d; +} \ No newline at end of file