diff --git a/public/mix-manifest.json b/public/mix-manifest.json index 8ab55c34..e77f1622 100644 --- a/public/mix-manifest.json +++ b/public/mix-manifest.json @@ -74,5 +74,23 @@ "/chunks/user-password.js": "/chunks/user-password.js", "/chunks/user-storage.js": "/chunks/user-storage.js", "/chunks/user-subscription.js": "/chunks/user-subscription.js", - "/chunks/users.js": "/chunks/users.js" + "/chunks/users.js": "/chunks/users.js", + "/js/main.1116b58ef850b0d7e6c1.hot-update.js": "/js/main.1116b58ef850b0d7e6c1.hot-update.js", + "/js/main.6946958f555d97fdde24.hot-update.js": "/js/main.6946958f555d97fdde24.hot-update.js", + "/js/main.11519e3f1f4b381460e1.hot-update.js": "/js/main.11519e3f1f4b381460e1.hot-update.js", + "/js/main.375c154fd9f9240050d6.hot-update.js": "/js/main.375c154fd9f9240050d6.hot-update.js", + "/js/main.e80c042abed521780289.hot-update.js": "/js/main.e80c042abed521780289.hot-update.js", + "/js/main.4039781b64165019af1e.hot-update.js": "/js/main.4039781b64165019af1e.hot-update.js", + "/js/main.2be99a0eec70df1695df.hot-update.js": "/js/main.2be99a0eec70df1695df.hot-update.js", + "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.1c3d9a46902779640cb7.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.1c3d9a46902779640cb7.hot-update.js", + "/js/main.2b9ecac46338083d7de9.hot-update.js": "/js/main.2b9ecac46338083d7de9.hot-update.js", + "/chunks/shared-page.2b9ecac46338083d7de9.hot-update.js": "/chunks/shared-page.2b9ecac46338083d7de9.hot-update.js", + "/js/main.6dd00119b130336463df.hot-update.js": "/js/main.6dd00119b130336463df.hot-update.js", + "/js/main.5908348e9980052c4cfa.hot-update.js": "/js/main.5908348e9980052c4cfa.hot-update.js", + "/js/main.4185db090221550d85ee.hot-update.js": "/js/main.4185db090221550d85ee.hot-update.js", + "/js/main.4cbd8999f1f90f08165b.hot-update.js": "/js/main.4cbd8999f1f90f08165b.hot-update.js", + "/js/main.000fae35402f1a759d1f.hot-update.js": "/js/main.000fae35402f1a759d1f.hot-update.js", + "/js/main.288465b6020b308e9695.hot-update.js": "/js/main.288465b6020b308e9695.hot-update.js", + "/js/main.6153ba03604d8736903f.hot-update.js": "/js/main.6153ba03604d8736903f.hot-update.js", + "/js/main.9f2f4c380dd317be8da0.hot-update.js": "/js/main.9f2f4c380dd317be8da0.hot-update.js" } diff --git a/resources/js/App.vue b/resources/js/App.vue index 108fdba0..38f0b66c 100644 --- a/resources/js/App.vue +++ b/resources/js/App.vue @@ -5,6 +5,7 @@
+ diff --git a/resources/js/components/FilesView/ContextMenu.vue b/resources/js/components/FilesView/ContextMenu.vue index bf493dbf..971e9c5d 100644 --- a/resources/js/components/FilesView/ContextMenu.vue +++ b/resources/js/components/FilesView/ContextMenu.vue @@ -7,34 +7,47 @@ :style="{ top: positionY + 'px', left: positionX + 'px' }" > -
diff --git a/resources/js/components/FilesView/FileFullPreview.vue b/resources/js/components/FilesView/FileFullPreview.vue index c709f804..622f4e07 100644 --- a/resources/js/components/FilesView/FileFullPreview.vue +++ b/resources/js/components/FilesView/FileFullPreview.vue @@ -70,7 +70,9 @@ export default { }) events.$on('fileFullPreview:hide', () => { this.showFullPreview = false - }) + + events.$emit('hide:mobile-navigation') + }) } } diff --git a/resources/js/components/FilesView/FilePreviewNavigationPanel.vue b/resources/js/components/FilesView/FilePreviewNavigationPanel.vue index 8a89d4b7..9c8e54d4 100644 --- a/resources/js/components/FilesView/FilePreviewNavigationPanel.vue +++ b/resources/js/components/FilesView/FilePreviewNavigationPanel.vue @@ -133,14 +133,17 @@ export default { height: 22px; display: flex; position: relative; - // align-items: center; + align-items: center; flex-grow: 1; align-self: center; white-space: nowrap; + .name-count-wrapper { - .file-count { + margin-left: 6px; + margin-right: 6px; + + .file-count { @include font-size(15); - margin-left: 6px; line-height: 1; font-weight: 700; overflow: hidden; @@ -173,7 +176,6 @@ export default { border-radius: 6px; vertical-align: middle; cursor: pointer; - margin-right: 6px; color: $text; align-self: center; @include transition(150ms); @@ -227,32 +229,19 @@ export default { } } -@media (min-width: 420px) and (max-width: 985px) { - .name-wrapper { - width: 67%; - } -} -@media (max-width: 570px) { - .name-wrapper { - width: 100%; - justify-content: space-between; - } -} .created-at-wrapper { width: 33%; - // height: 100%; display: flex; text-align: center; justify-content: center; + p { display: flex; align-items: center; @include font-size(11); } - @media (max-width: 985px) { - display: none; - } } + .navigation-icons { width: 33%; text-align: right; @@ -262,21 +251,15 @@ export default { display: inline-block; vertical-align: middle; } - @media (max-width: 960px) { - .mobile-hide { - display: none; - } - } + .button { margin-left: 5px; &:hover { background: $light_background; } } - @media (max-width: 570px) { - display: none; - } } + .navigation-panel { height: 63px; width: 100%; @@ -287,33 +270,61 @@ export default { align-items: center; background-color: white; color: $text; - @media (max-width: 960px) { - & { - height: 53px; - padding: 15px; - } - } } + +@media (max-width: 960px) { + + .context-menu { + + .name-wrapper { + width: 67%; + } + } + + .navigation-icons { + display: none; + } + + .navigation-panel { + height: 53px; + padding: 15px; + } + + .created-at-wrapper { + display: none; + } + + .name-wrapper { + justify-content: space-between; + flex-direction: row-reverse; + width: 100%; + } +} + @media (prefers-color-scheme: dark) { .navigation-panel { - background-color: $dark_mode_foreground; + background-color: $dark_mode_background; color: $dark_mode_text_primary; + .icon-close { color: $dark_mode_text_primary; &:hover { background-color: $dark_mode_background; } } + .fast-menu-icon:hover { background: $dark_mode_background; } } + .name-wrapper { .title, .file-count { color: $dark_mode_text_primary !important; } } + .navigation-icons { .button:hover { background: $dark_mode_background; diff --git a/resources/js/components/FilesView/MediaFullPreview.vue b/resources/js/components/FilesView/MediaFullPreview.vue index 7f8a707e..cb958373 100644 --- a/resources/js/components/FilesView/MediaFullPreview.vue +++ b/resources/js/components/FilesView/MediaFullPreview.vue @@ -166,23 +166,32 @@ export default { justify-content: center; align-items: center; background-color: white; + .file-wrapper { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; + .file-shadow { - box-shadow: 0 8px 40px rgba(17, 26, 52, 0.1); + box-shadow: 0 8px 40px rgba(17, 26, 52, 0.15); } + .file { max-width: 100%; max-height: 100%; align-self: center; } + .audio { border-radius: 28px; } + + img { + border-radius: 4px; + } + .video-wrapper { max-width: 1080px; max-height: 100%;