Commit d1c6b2a1 authored by ras19's avatar ras19
Browse files

Added changes to styling that was done in users_login [RS, EW]

parents 31a5a688 1d4032c1
......@@ -9,8 +9,6 @@ const ProjectDetails = () => {
const { data: project, error, isPending } = useFetch("/projects/" + id)
const { data: assignments, errorAssignment, isPendingAssignment } = useFetch("/user_project/" + id)
// const relevantAssignments = user_project_assignments.filter(assignment => assignment.project_id === { id })
const handleRemove = e => {
e.preventDefault()
fetch("/projects/" + id, { method: 'DELETE' })
......@@ -45,14 +43,13 @@ const ProjectDetails = () => {
{project && <p>{project.description}</p>}
<h3>Volunteers working on this project</h3>
<div>
{assignments.map(a => {
<div className="preview" key={a.id}>
<div className="project_user_assignment_list">
{assignments.map(a => (
<div className="assigned_users_preview" style={{float: "left", width: "50%"}} key={a.id}>
<Link to={`/users/${a.username}`}>
<h2>{a.username}</h2>
<h4>{a.username}</h4>
</Link>
</div>
}
</div>)
)
}
</div>
......
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@100&display=swap');
* {
margin: 0;
font-family: "Raleway";
......@@ -20,15 +19,15 @@
}
.home button {
background-color: #ff4e83;
background-color: #ff4e83;
color: rgb(0, 0, 0);
padding: 15px 32px;
font-size: 20px;
border-radius: 12px;
}
.home button:hover{
background-color: #8f0830;
.home button:hover {
background-color: #8f0830;
}
.navbar {
......@@ -40,6 +39,7 @@
border-bottom: 1px solid #f2f2f2;
color: #ff4e83;
}
.navbar h1 {
color: #ff4e83;
}
......@@ -54,9 +54,11 @@
padding: 6px;
color: rgb(0, 0, 0);
}
.navbar a:hover {
color: #f1356d;
}
.content {
max-width: 1000px;
padding: 20px;
......@@ -64,6 +66,7 @@
}
/* any preview */
.preview {
padding: 6px;
margin: 2px;
......@@ -90,6 +93,14 @@
padding-left: 4px;
}
.preview h4 {
font-size: 10;
color: rgb(0, 0, 0);
padding-bottom: 5px;
padding-top: 5px;
padding-left: 4px;
}
.preview a {
text-decoration: none;
}
......@@ -133,7 +144,7 @@
/* Project details */
.project-details h2, .user h2{
.project-details h2, .user h2 {
font-size: 35px;
color: #f1356d;
margin-bottom: 10px;
......@@ -177,30 +188,77 @@
background: #8f0830;
}
.assigned_users_preview {
padding: 6px;
margin: 2px;
border-bottom: 1px;
border-radius: 5px;
box-shadow: 1px 3px 5px rgb(194, 194, 194);
}
.assigned_users_preview:hover {
box-shadow: 1px 3px 5px gray;
}
.assigned_users_preview h4 {
font-size: 10;
color: rgb(0, 0, 0);
padding-bottom: 5px;
padding-top: 5px;
padding-left: 4px;
}
.assigned_users_preview a {
text-decoration: none;
}
.project_user_assignment_list {
margin-bottom: 30px;
margin-right: 10px;
}
/* Create new project form and edit project */
<<<<<<< HEAD
.create-project .edit-project, .edit-user, .add-project-task, .change-password, .login{
=======
.create-project .edit-project, .edit-user, .add-project-task {
>>>>>>> project_user_assignment
max-width: 400px;
margin: 0 auto;
text-align: center;
}
<<<<<<< HEAD
.create-project label, .edit-project label, .add-user label, .edit-user label, .add-todo-form label, .change-password label,
.add-project-task label, .login label{
=======
.create-project label, .edit-project label, .add-user label, .edit-user label, .add-todo-form label, .add-project-task label {
>>>>>>> project_user_assignment
text-align: left;
display: block;
font-size: 20px;
}
<<<<<<< HEAD
.create-project h2, .edit-project h2, .add-user h2, .edit-user h2, .add-todo-form h2, .add-project-task h2, .change-password h2,
.login h2{
=======
.create-project h2, .edit-project h2, .add-user h2, .edit-user h2, .add-todo-form h2, .add-project-task h2 {
>>>>>>> project_user_assignment
font-size: 35px;
color: #f1356d;
margin-bottom: 30px;
}
<<<<<<< HEAD
.create-project input, .create-project textarea, .create-project select,
.edit-project input, .edit-project textarea, .edit-project select, .add-user input,
.edit-user input, .add-todo-form input, .add-todo-form textarea, .add-todo-form select,
.add-project-task input, .add-project-task textarea, .add-project-task select, .change-password input, .login input{
=======
.create-project input, .create-project textarea, .create-project select, .edit-project input, .edit-project textarea, .edit-project select, .add-user input, .edit-user input, .add-todo-form input, .add-todo-form textarea, .add-todo-form select, .add-project-task input, .add-project-task textarea, .add-project-task select {
>>>>>>> project_user_assignment
width: 100%;
padding: 6px 10px;
margin: 10px 0;
......@@ -208,12 +266,26 @@
box-sizing: border-box;
display: block;
}
<<<<<<< HEAD
=======
.create-project button:hover, .edit-project button:hover, .add-user button:hover, .edit-user button:hover, .todo-list button:hover,
.add-project-task button:hover {
background: #8f0830;
.create-project button, .edit-project button, .add-user button, .edit-user button, .add-todo-form button, .add-project-task button {
background: #f1356d;
color: #fff;
border: 0;
padding: 8px;
border-radius: 8px;
cursor: pointer;
font-size: 25px;
text-decoration: none;
margin-bottom: 30px;
margin-right: 10px;
}
>>>>>>> project_user_assignment
.create-project button:hover, .edit-project button:hover, .add-user button:hover, .edit-user button:hover, .todo-list button:hover, .add-project-task button:hover {
background: #8f0830;
}
/* My Profile */
......@@ -231,21 +303,18 @@
/* Page not found */
.page-not-found h2, .page-not-found p{
.page-not-found h2, .page-not-found p {
margin-bottom: 10px;
}
/* Add New User */
.add-user label, .add-project-task label {
text-align: left;
display: block;
font-size: 20px;
}
.users h1 {
font-style: bold;
font-size: 50px;
......@@ -253,10 +322,8 @@
margin-bottom: 50px;
}
/* Position and sizing of burger button */
.bm-burger-button {
position: fixed;
width: 36px;
......@@ -266,22 +333,26 @@
}
/* Color/shape of burger icon bars */
.bm-burger-bars {
background: #373a47;
}
/* Color/shape of burger icon bars on hover*/
.bm-burger-bars-hover {
background: #a90000;
}
/* Position and sizing of clickable cross button */
.bm-cross-button {
height: 24px;
width: 24px;
}
/* Color/shape of close button cross */
.bm-cross {
background: #248f0f;
}
......@@ -290,42 +361,48 @@
Sidebar wrapper styles
Note: Beware of modifying this element as it can break the animations - you should not need to touch it in most cases
*/
.bm-menu-wrap {
position: fixed;
height: 100%;
}
/* General sidebar styles */
.bm-menu {
padding: 2.5em 1.5em 0;
font-size: 1.15em;
}
/* Morph shape necessary with bubble or elastic */
.bm-morph-shape {
fill: #373a47;
}
/* Wrapper for item list */
.bm-item-list {
color: #5a0808;
padding: 0.8em;
}
/* Individual item */
.bm-item {
display: inline-block;
}
/* Styling of overlay */
.bm-overlay {
background: rgba(0, 0, 0, 0.3);
}
/* Individual item */
.bm-item {
display: inline-block;
color: #5d076e;
margin-bottom: 10px;
text-align: left;
......@@ -338,6 +415,7 @@ Note: Beware of modifying this element as it can break the animations - you shou
}
/* Personal todos */
.personal-todos {
display: block;
max-height: 1000px;
......@@ -362,7 +440,7 @@ Note: Beware of modifying this element as it can break the animations - you shou
.todo-preview h2 {
padding-top: 10px;
font-size: 20;
color:rgb(230, 106, 18);
color: rgb(230, 106, 18);
padding-bottom: 7px;
}
......@@ -415,7 +493,7 @@ Note: Beware of modifying this element as it can break the animations - you shou
display: none;
}
.add-todo-button button{
.add-todo-button button {
background: rgb(230, 106, 18);
color: #fff;
border: 0;
......@@ -433,6 +511,7 @@ Note: Beware of modifying this element as it can break the animations - you shou
}
/* Project tasks */
.project-tasks {
margin-bottom: 30px;
}
......@@ -500,4 +579,8 @@ Note: Beware of modifying this element as it can break the animations - you shou
text-decoration: none;
margin-bottom: 10px;
margin-right: 10px;
<<<<<<< HEAD
}
=======
}
>>>>>>> project_user_assignment
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment