Styling for cohort form

stevebrownlee · Jan 10, 2024 · 0f75fc9 · 0f75fc9
1 parent 489b382
commit 0f75fc9
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 11 deletions.
diff --git a/src/components/cohorts/CohortDetails.js b/src/components/cohorts/CohortDetails.js
@@ -159,7 +159,7 @@ export const CohortDetails = () => {
                                     />
                                 </div>
 
-                                <button onClick={saveURLs}>Save URLs</button>
+                                <button className="isometric-button blue" onClick={saveURLs}>Save URLs</button>
                             </div>
 
                             <div className="cohort__detail cohort__detail--medium">

diff --git a/src/components/cohorts/CohortForm.js b/src/components/cohorts/CohortForm.js
@@ -94,7 +94,8 @@ export const CohortForm = () => {
                         {
                             courses.map(course => {
                                 return <button key={`course--${course.id}`}
-                                    className={`${clientSideCourse === course.id ? "button-28--achieved" : "button-28"}`}
+                                    style={{ margin: "0 0.15rem" }}
+                                    className={`isometric-button ${clientSideCourse === course.id ? "red" : "gray"}`}
                                     onClick={e => {
                                         e.preventDefault()
                                         setClient(course.id)
@@ -112,7 +113,8 @@ export const CohortForm = () => {
                         {
                             courses.map(course => {
                                 return <button key={`course--${course.id}`}
-                                    className={`${serverSideCourse === course.id ? "button-28--achieved" : "button-28"}`}
+                                    style={{ margin: "0 0.15rem" }}
+                                    className={`isometric-button ${serverSideCourse === course.id ? "red" : "gray"}`}
                                     onClick={e => {
                                         e.preventDefault()
                                         setServer(course.id)
@@ -131,7 +133,7 @@ export const CohortForm = () => {
                             constructNewCohort()
                         }
                     }
-                    className="btn btn-primary"> Create </button>
+                    className="isometric-button blue"> Create </button>
             </form>
         </>
     )

diff --git a/src/components/people/StudentNotePopup.js b/src/components/people/StudentNotePopup.js
@@ -29,6 +29,13 @@ export const StudentNotePopup = ({ student }) => {
         })
     }
 
+    const completeNoteCreation = () => {
+        createStudentNote()
+            .then(() => getStudentNotes(student.id))
+            .then(() => setNote(""))
+            .then(() => setOpen(false))
+    }
+
     return (
         <Popover.Root open={open} onOpenChange={isOpen => {
             setOpen(isOpen)
@@ -54,10 +61,7 @@ export const StudentNotePopup = ({ student }) => {
                                 onKeyDown={
                                     e => {
                                         if (e.key === "Enter") {
-                                            createStudentNote()
-                                                .then(() => getStudentNotes(student.id))
-                                                .then(() => setNote(""))
-                                                .then(() => setOpen(false))
+                                            completeNoteCreation()
                                         }
                                     }
                                 } />
@@ -66,9 +70,9 @@ export const StudentNotePopup = ({ student }) => {
                     <Popover.Arrow className="PopoverArrow" />
 
                     <div style={{ display: 'flex', flexDirection: 'row', gap: 10 }}>
-                        <button style={{
-                            marginLeft: "auto"
-                        }} className="isometric-button blue small">Save</button>
+                        <button
+                            onClick={completeNoteCreation}
+                            style={{ marginLeft: "auto" }} className="isometric-button blue small">Save</button>
                     </div>
                 </Popover.Content>
             </Popover.Portal>
-Original file line number
+Diff line change
@@ Expand Up / @@ -159,7 +159,7 @@ export const CohortDetails = () => { @@
                                         />
                                     </div>
-                                    <button onClick={saveURLs}>Save URLs</button>
+                                    <button className="isometric-button blue" onClick={saveURLs}>Save URLs</button>
                                 </div>
                                 <div className="cohort__detail cohort__detail--medium">
@@ Expand Down @@