styling refactor, player audio mode

5 files changed, 14 insertions, 26 deletions

diff --git a/apps/Notes/components/Export.js b/apps/Notes/components/Export.js
index 516c0ec..ccfb69a 100644
--- a/apps/Notes/components/Export.js
+++ b/apps/Notes/components/Export.js
@@ -37,7 +37,7 @@ const Export = ({ setAction }) => {
               name='selectAll'
               onChange={e => handleSelectAll(e, notes, setIds)}
               checked={notes.length === ids.length}
-              className='hidden'
+              className='hide'
             />
             <span style={{ color: notes.length === ids.length ? 'green' : 'brown' }}>
               <FontAwesomeIcon icon={notes.length === ids.length ? faCheck : faTimes} />
@@ -58,7 +58,7 @@ const Export = ({ setAction }) => {
                     value={note.noteId}
                     checked={ids.includes(note.noteId)}
                     onChange={() => handleSelect(note.noteId, ids, setIds)}
-                    className='hidden'
+                    className='hide'
                   />
                   <span style={{ color: checked ? 'green' : 'brown' }}>
                     <FontAwesomeIcon icon={checked ? faCheck : faTimes} />
diff --git a/apps/Notes/components/NoteView.js b/apps/Notes/components/NoteView.js
index c6afe1f..19352c3 100644
--- a/apps/Notes/components/NoteView.js
+++ b/apps/Notes/components/NoteView.js
@@ -21,7 +21,7 @@ const NoteView = ({ fetchedNote, setFetchedNote, setAction }) => {
   const { _id, content, title } = fetchedNote
 
   return (
-    <section className={styles.noteView}>
+    <>
       <div className='window__submenu'>
         <div>
           <div onClick={() => { setFetchedNote(); setAction('') }}>{t('back')}</div>
@@ -31,12 +31,13 @@ const NoteView = ({ fetchedNote, setFetchedNote, setAction }) => {
           <div onClick={e => { removeNote(e, _id, mutateNotes, t, setPopup, setAction) }}>{t('remove')}</div>
         </div>
       </div>
-
-      <div className='window__scroll'>
-        <h2>{title}</h2>
-        <p>{content}</p>
-      </div>
-    </section>
+      <section className={`${styles.noteView} window__scroll`}>
+        <div>
+          <h2>{title}</h2>
+          <p>{content}</p>
+        </div>
+      </section>
+    </>
   )
 }
 
diff --git a/apps/Notes/styles/_import.scss b/apps/Notes/styles/_import.scss
index efdd047..bab0655 100644
--- a/apps/Notes/styles/_import.scss
+++ b/apps/Notes/styles/_import.scss
@@ -4,11 +4,6 @@
     to {opacity: 1;}
   }
 
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
   animation: fade-in .3s;
 
   form {
diff --git a/apps/Notes/styles/_noteEdit.scss b/apps/Notes/styles/_noteEdit.scss
index 43191fe..29facbd 100644
--- a/apps/Notes/styles/_noteEdit.scss
+++ b/apps/Notes/styles/_noteEdit.scss
@@ -1,4 +1,6 @@
 .noteEdit {
+  height: 100%;
+
   @keyframes fade-in {
     from {opacity: 0;}
     to {opacity: 1;}
@@ -6,11 +8,6 @@
 
   display: flex;
   flex-direction: column;
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
   padding: 1em 1em 2em;
   animation: fade-in .3s;
 
diff --git a/apps/Notes/styles/_noteView.scss b/apps/Notes/styles/_noteView.scss
index 51e7edd..37db6aa 100644
--- a/apps/Notes/styles/_noteView.scss
+++ b/apps/Notes/styles/_noteView.scss
@@ -4,22 +4,17 @@
     to {opacity: 1;}
   }
 
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
   animation: fade-in .3s;
 
   h2 {
-    padding: .75em;
+    padding: 1rem;
     font-size: 1.25em;
     font-weight: 600;
     user-select: text;
   }
 
   p {
-    padding: .75em;
+    padding: .5rem 1rem 1rem;
     line-height: 1.33;
     white-space: pre-line;
     user-select: text;