Merge pull request #43 from IzzyDotExe/user-notes

refac and fix notes scroll

arc3-dash/src/components/Notes/NotesDisplay.css

@@ -0,0 +1,5 @@
+
+.notes-display {
+    width: 100%;
+    overflow-x: scroll;
+}

arc3-dash/src/components/Notes/NotesDisplay.jsx

@@ -0,0 +1,15 @@
+import {Note} from "./Note";
+import "./NotesDisplay.css"
+
+export default function NotesDisplay({notes, filter}) {
+
+    return <section className="notes-display">
+        {
+            notes.sort((a, b) => {
+                return parseInt(b.date) - parseInt(a.date)
+            }).map((x, i) => {
+                return <Note note={x} lid={i} key={i}/>
+            })
+        }
+    </section>
+}

arc3-dash/src/components/Notes/NoteUserList.css → arc3-dash/src/components/Notes/NotesUserList.css

@@ -1,4 +1,5 @@
 .note-user {
     display: flex;
     justify-content: space-between;
+    overflow-x: scroll;
 }

arc3-dash/src/components/Notes/NotesUserList.jsx

@@ -1,5 +1,5 @@
 import {NoteUser} from "./NoteUser";
-import './NoteUserList.css'
+import './NotesUserList.css'
 import {useEffect, useState} from "react";
 
 export default function NoteUserList({notesUsers, setNotes, filter}) {

arc3-dash/src/routes/Notes.css

@@ -28,11 +28,6 @@
   margin: 10px 30px;
 }
 
-.notes-display {
-  width: 100%;
-  overflow-x: scroll;
-}
-
 .notes > section >  h2 {
   color: white;
   font-size: xx-large;

arc3-dash/src/routes/Notes.jsx

@@ -6,6 +6,7 @@ import "./Notes.css"
 
 import NoteUserList from "../components/Notes/NotesUserList";
 import {Note} from "../components/Notes/Note";
+import NotesDisplay from "../components/Notes/NotesDisplay";
 
 export default function Notes() {
 
@@ -45,15 +46,3 @@ export default function Notes() {
 }
 
 
-function NotesDisplay({notes, filter}) {
-
-    return <section className="notes-display">
-        {
-            notes.sort((a, b) => {
-                return parseInt(b.date) - parseInt(a.date)
-            }).map((x, i) => {
-                return <Note note={x} lid={i} key={i}/>
-            })
-        }
-    </section>
-}