Skip to content

Commit 82c012c

Browse files
committed
fix conflicts and added hover-darker color var
2 parents b9c7ea0 + 3864809 commit 82c012c

24 files changed

+540
-370
lines changed

devU-client/src/assets/global.scss

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -23,9 +23,7 @@
2323
text-align: center;
2424
}
2525

26-
span {
27-
color: var(--text-color)
28-
}
26+
2927

3028
hr {
3129
border: 1px solid #ddd;
@@ -45,6 +43,7 @@
4543
font-weight: 700;
4644
font-size: 16px;
4745
transition: all 0.2s ease;
46+
font-family: 'Source Sans Pro', 'Helvetica', 'Arial', sans-serif;
4847

4948
&:disabled {
5049
opacity: 60%;
@@ -58,7 +57,7 @@
5857
margin-bottom: 20px;
5958
}
6059

61-
button.btnPrimary {
60+
.btnPrimary {
6261
@extend .btn;
6362
background-color: var(--primary);
6463
border: 3px solid var(--primary);
@@ -70,7 +69,7 @@
7069
}
7170
}
7271

73-
button.btnSecondary {
72+
.btnSecondary {
7473
@extend .btn;
7574

7675
background-color: var(--btn-secondary-background);
@@ -82,7 +81,7 @@
8281
}
8382
}
8483

85-
button.btnDelete {
84+
.btnDelete {
8685
@extend .btn;
8786
background-color: var(--btn-delete-background);
8887
color: var(--btn-delete-text);
@@ -329,6 +328,11 @@
329328
color: var(--text-color);
330329
}
331330

331+
.textField{
332+
border: 2px solid #ccc;
333+
margin-bottom: 5px;
334+
}
335+
332336
// Global Input Field Styles
333337
.input-field {
334338
width: 100%;

devU-client/src/assets/variables.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ $text-color: var(--text-color);
1010
$text-color-secondary: var(--text-color-secondary);
1111

1212
$primary: var(--primary);
13+
$hover-darker: var(--hover-darker);
1314

1415
$secondary-lighter: var(--secondary-lighter);
1516
$secondary: var(--secondary);
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.textField{
2+
border: 2px solid #ccc;
3+
}

devU-client/src/components/forms/editUserForm.tsx

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -41,17 +41,18 @@ const EditUserForm = ({ user, onSubmit }: Props) => {
4141
}
4242

4343
return (
44-
<div>
44+
<div style={{display:'flex', flexDirection: 'column', alignItems: 'center', gap: '10px'}}>
4545
<h1>User Information</h1>
4646
<TextField
4747
onChange={handleUpdatePreferredName}
48-
label='Preferred Name'
48+
placeholder='Preferred Name'
49+
className='textField'
4950
id='preferredName'
5051
defaultValue={user.preferredName}
5152
/>
52-
<TextField type='email' label="Email" id='email' placeholder={user.email} disabled={true} />
53-
<TextField label='Person Number' id='externalId' placeholder={user.externalId} disabled={true} />
54-
<Button onClick={handleSubmit} loading={loading}>
53+
<TextField type='email' placeholder='Email Address' id='email' defaultValue={user.email} className='textField' disabled={true} />
54+
<TextField placeholder='Person Number' id='externalId' defaultValue={user.externalId} className='textField' disabled={true} />
55+
<Button onClick={handleSubmit} loading={loading} className='btnPrimary'>
5556
Update
5657
</Button>
5758
</div>

devU-client/src/components/listItems/assignmentProblemListItem.tsx

Lines changed: 21 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
1-
import React, { useState, useEffect} from 'react'
2-
import { useParams } from 'react-router-dom'
3-
import RequestService from 'services/request.service'
4-
import {AssignmentProblem, NonContainerAutoGrader} from 'devu-shared-modules'
1+
import React, { useEffect, useState } from 'react'
2+
import { AssignmentProblem } from 'devu-shared-modules'
3+
54

65
import styles from './assignmentProblemListItem.scss'
76
import FaIcon from 'components/shared/icons/faIcon'
@@ -13,39 +12,25 @@ type Props = {
1312
}
1413

1514
const AssignmentProblemListItem = ({problem, handleChange, disabled}: Props) => {
16-
const { courseId } = useParams<{ courseId: string }>()
17-
const [ncags, setNcags] = useState<NonContainerAutoGrader[]>([])
18-
19-
//const type = ncags.at(0)?.metadata
15+
const [meta, setMeta] = useState<{options: {[key:string]: string}, type: string}>()
2016

21-
const fetchNcags = async() => {
22-
await RequestService.get(`/api/course/${courseId}/assignment/${problem.assignmentId}/non-container-auto-graders`).then((res) => setNcags(res))
23-
}
2417

2518
const getMeta = () => {
26-
if (ncags && ncags.length > 0){
27-
const ncag = ncags.find(ncag => ((ncag.question == problem.problemName) && (ncag.createdAt === problem.createdAt))) // currently checking against createdAt since if two non-code questions have the same name they can be confused otherwise, can be removed once meta string added to assignemntproblem
28-
if (!ncag || !ncag.metadata) {
29-
return undefined
30-
}
31-
return JSON.parse(ncag.metadata)
32-
}
19+
setMeta(problem.metadata)
3320
}
3421

35-
3622
useEffect(() => {
37-
fetchNcags()
38-
}, [])
39-
40-
const meta = getMeta()
41-
if (!meta || !meta.type){
23+
getMeta()
24+
}, [problem])
25+
26+
if (!meta){
4227
return (
4328
<div className={styles.problem}>
4429
<div>File Input Problems are not done yet pending backend changes! :D</div>
4530
</div>)
4631
}
4732

48-
const type = meta.type
33+
const type = meta.type
4934
if (type == "Text") {
5035
return (
5136
<div key={problem.id} className={styles.problem}>
@@ -59,14 +44,17 @@ const AssignmentProblemListItem = ({problem, handleChange, disabled}: Props) =>
5944
id={problem.problemName}
6045
/>
6146
</div>
62-
)} else if(type == "MCQ-mult") {
47+
)}
48+
49+
else if(type == "MCQ-mult") {
6350
const options = meta.options
6451
if (!options){
6552
return <div></div>
6653
}
6754
return (
6855
<div key={problem.id} className={styles.problem}>
6956
<h4 className={styles.problem_header}>{problem.problemName}</h4>
57+
{console.log(options)}
7058
{Object.keys(options).map((key : string) => (
7159
<label key={key} className={styles.mcqLabel} style={disabled ? {cursor: 'default'} : undefined}>
7260
<input id={problem.problemName}
@@ -80,7 +68,9 @@ const AssignmentProblemListItem = ({problem, handleChange, disabled}: Props) =>
8068
</span>{/* custom checkbox */}
8169
</label>))}
8270
</div>)
83-
} else if(type == "MCQ-single") {
71+
}
72+
73+
else if(type == "MCQ-single") {
8474
const options = meta.options
8575
if (!options){
8676
return <div></div>
@@ -99,9 +89,11 @@ const AssignmentProblemListItem = ({problem, handleChange, disabled}: Props) =>
9989
<span className={styles.radio}></span>{/* custom radio button */}
10090
</label>))}
10191
</div>)
102-
} else {
92+
}
93+
94+
else {
10395
return(
104-
<div>Unknown type, something is wrong on the backend!</div>)
96+
<div>{console.log(meta)}Unknown type, something is wrong on the backend!</div>)
10597
}
10698
}
10799

devU-client/src/components/listItems/userCourseListItem.scss

Lines changed: 6 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -16,25 +16,9 @@
1616
overflow-wrap: break-word;
1717
}
1818

19-
.No_assignments {
20-
display: flex;
21-
justify-content: center;
22-
align-items: center;
23-
text-align: center;
24-
flex-grow: 1;
25-
font-size: 12px;
26-
font-weight: 500;
27-
padding: 15px;
28-
font-style: italic;
29-
flex-wrap: wrap;
30-
// color: $primary;
31-
color: $text-color;
32-
text-overflow: ellipsis;
33-
overflow-wrap: break-word;
34-
border-bottom: 1px solid #ddd;
35-
}
3619

37-
.Buttons {
20+
21+
.buttons {
3822
display: flex;
3923
justify-content: center;
4024
cursor: default;
@@ -51,6 +35,10 @@
5135
margin: 0 10px;
5236
cursor: pointer;
5337
font-size: 16px;
38+
transition: .2s ease color;
39+
&:hover{
40+
color: var(--hover-darker);
41+
}
5442
}
5543

5644
.tag {

devU-client/src/components/listItems/userCourseListItem.tsx

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,9 @@ import { useHistory } from "react-router-dom";
44
import ListItemWrapper from 'components/shared/layouts/listItemWrapper'
55
import FaIcon from 'components/shared/icons/faIcon'
66

7-
//import {prettyPrintDate} from 'utils/date.utils'
87

98
import styles from './userCourseListItem.scss'
10-
119
import SimpleAssignmentListItem from "./simpleAssignmentListItem";
12-
//import {prettyPrintSemester} from "../../utils/semester.utils";
1310

1411
type Props = {
1512
course: Course
@@ -33,7 +30,7 @@ const UserCourseListItem = ({ course, assignments, past = false, instructor = fa
3330
{assignments && assignments.length > 0 ? (assignments.map((assignment) => (
3431
(new Date(assignment.dueDate) > currentTime) && <SimpleAssignmentListItem assignment={assignment} key={assignment.id} />
3532
))) : past && <div></div> }
36-
<div className={styles.Buttons}>
33+
<div className={styles.buttons}>
3734
<button className={styles.sub_button} onClick={(e) => {
3835
e.stopPropagation();
3936
history.push(`/course/${course.id}`);

devU-client/src/components/misc/globalToolbar.scss

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,6 @@ $font-size: 16px;
3838
background-color: $primary;
3939
font-size: 40px;
4040
color: #D9D9D9;
41-
font-weight: 550;
4241
padding: 0 $pagePadding;
4342

4443
@extend .flex;

devU-client/src/components/pages/assignments/assignmentDetailPage.scss

Lines changed: 5 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -94,10 +94,10 @@
9494
.affirmation{
9595
display: flex;
9696
align-items: center;
97-
margin-top: 10px;
97+
margin: 15px auto;
98+
9899
align-self: flex-start;
99100
gap: 10px;
100-
margin: auto;
101101
}
102102

103103
.affirmText{
@@ -210,11 +210,6 @@
210210
margin-bottom: 20px;
211211
}
212212

213-
.submissionCard {
214-
margin-bottom : 15px;
215-
background-color: $list-item-background;
216-
}
217-
218213
.fileInput {
219214
margin-top: 20px;
220215
}
@@ -230,7 +225,8 @@
230225
.submissionsContainer {
231226
display: flex;
232227
flex-direction: column;
233-
width: 100%;
228+
margin: auto;
229+
width: 80%;
234230
margin-top: 20px;
235231
}
236232

@@ -248,7 +244,7 @@
248244
}
249245

250246
.submissionCard:hover {
251-
background-color: var(--purple-lightest);
247+
background-color: var(--hover-lighter);
252248
}
253249

254250
.submissionHeading {

devU-client/src/components/pages/assignments/assignmentDetailPage.tsx

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,6 @@ const AssignmentDetailPage = () => {
105105
const value = e.target.value;
106106
const key = e.target.id;
107107
if (type === 'checkbox') { // behavior for multiple choice - multiple answer questions
108-
109108
const newState = e.target.checked;
110109

111110
setFormData(prevState => {
@@ -245,7 +244,6 @@ const AssignmentDetailPage = () => {
245244
</div>}
246245
</div>
247246

248-
<h3 style={{ textAlign: 'center' }}>Problems</h3>
249247
<div className={styles.problems_section}>
250248

251249
{/* <div className={styles.file_upload}>
@@ -268,7 +266,7 @@ const AssignmentDetailPage = () => {
268266
<label htmlFor='ai-check' className={styles.affirmText}>I affirm that I have complied with this course’s academic integrity policy as defined in the syllabus.</label>
269267
</div>
270268
<button className='btnPrimary'
271-
style={{ marginTop: '40px' }}
269+
style={{ margin: '10px 0' }}
272270
onClick={handleSubmit}
273271
disabled={notClickable}
274272
>Submit Assignment</button>
@@ -277,19 +275,18 @@ const AssignmentDetailPage = () => {
277275
</div>
278276
</div>
279277

280-
278+
279+
{submissions.length !== 0 &&
281280
<div>
282281
<div className={styles.submissionsContainer}>
283282
{submissions.map((submission, index) => (
284-
<div className={styles.submissionCard} key={index}>
285-
<div onClick={() => {
286-
history.push(`/course/${courseId}/assignment/${assignmentId}/submission/${submission.id}`)
287-
}}>
283+
<div className={styles.submissionCard} key={index} onClick={() => {
284+
history.push(`/course/${courseId}/assignment/${assignmentId}/submission/${submission.id}`)
285+
}}>
288286
<div>
289287
<div className={styles.submissionHeading}>{`Submission ${submissions.length - index}`}</div>
290288
<div className={styles.submissionTime}>{`Submitted at: ${submission.createdAt && prettyPrintDateTime(submission.createdAt)}`}</div>
291289
</div>
292-
</div>
293290
</div>
294291
))}
295292

@@ -300,7 +297,7 @@ const AssignmentDetailPage = () => {
300297
</div>
301298
)}
302299
</div>
303-
</div>
300+
</div>}
304301

305302
</PageWrapper>
306303
)

0 commit comments

Comments
 (0)