diff options
Diffstat (limited to 'apps')
| -rw-r--r-- | apps/Notes/components/Export.js | 4 | ||||
| -rw-r--r-- | apps/Notes/components/NoteView.js | 15 | ||||
| -rw-r--r-- | apps/Notes/styles/_import.scss | 5 | ||||
| -rw-r--r-- | apps/Notes/styles/_noteEdit.scss | 7 | ||||
| -rw-r--r-- | apps/Notes/styles/_noteView.scss | 9 | ||||
| -rw-r--r-- | apps/Player/styles/_player.scss | 10 | ||||
| -rw-r--r-- | apps/Youtube/styles/_results.scss | 23 |
7 files changed, 33 insertions, 40 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; diff --git a/apps/Player/styles/_player.scss b/apps/Player/styles/_player.scss index abc6582..7c74775 100644 --- a/apps/Player/styles/_player.scss +++ b/apps/Player/styles/_player.scss @@ -17,9 +17,13 @@ & > div:nth-of-type(2) { - overflow-y: scroll; + overflow-y: auto; overflow-x: hidden; - -webkit-overflow-scrolling: touch; + + @media (pointer: coarse) { + overflow-y: scroll; + -webkit-overflow-scrolling: touch; + } } & > div:nth-of-type(2), @@ -27,7 +31,7 @@ width: 48%; position: absolute; top: 0; - bottom: 2em; + bottom: 0; background-color: var(--color-glass); transition: .3s transform; diff --git a/apps/Youtube/styles/_results.scss b/apps/Youtube/styles/_results.scss index 9aba047..48437a2 100644 --- a/apps/Youtube/styles/_results.scss +++ b/apps/Youtube/styles/_results.scss @@ -1,15 +1,22 @@ .results { + display: flex; + flex-direction: column; + + & > div { + flex-grow: 1; + } + form { padding: .5em; justify-content: center; align-items: center; display: flex; - height: 4.5em; + height: 4em; input[type=text] { background-color: var(--color-window-content); color: var(--color-text-alt); - margin: 1em .5em 0; + margin: .5em .5em 0; height: 2.5rem; border: none; border-radius: .5em; @@ -24,15 +31,10 @@ font: inherit; } } - } - & > div { - position: fixed; - top: 9.5em; - left: 0; - right: 0; - bottom: 0; - height: auto; + & > input { + margin-top: .5em; + } } ul { @@ -64,7 +66,6 @@ margin-left: 1em; display: flex; flex-direction: column; - // justify-content: space-between; & > p:nth-of-type(2) { margin: .25em 0 .5em; |