Merge remote-tracking branch 'origin/master' into light

# Conflicts:
#	.env.testing
#	README.md
#	composer.json
#	composer.lock
#	config/language-translations.php
#	config/vuefilemanager.php
#	public/chunks/admin.js
#	public/chunks/database.js
#	public/chunks/demo.js
#	public/chunks/files.js
#	public/chunks/my-shared-items.js
#	public/chunks/platform.js
#	public/chunks/recent-uploads.js
#	public/chunks/settings-storage.js
#	public/chunks/settings.js
#	public/chunks/shared.js
#	public/chunks/shared/browser.js
#	public/chunks/shared/single-file.js
#	public/chunks/sign-in.js
#	public/chunks/status-check.js
#	public/chunks/trash.js
#	public/chunks/user-storage.js
#	public/css/tailwind.css
#	public/js/main.js
#	public/mix-manifest.json
#	resources/js/components/Subscription/UserFixedSubscriptionDetail.vue
#	resources/js/store/modules/userAuth.js
#	resources/js/views/Admin.vue
#	resources/js/views/Admin/PaymentSettings/PaymentSettingsTab/Payments.vue
#	resources/js/views/Admin/Plans.vue
#	resources/js/views/Admin/Plans/Create/CreateFixedPlan.vue
#	resources/js/views/Admin/Settings/AppSettingsTabs/SignInUp.vue
#	resources/js/views/Demo.vue
#	resources/js/views/Frontpage/Homepage.vue
#	resources/js/views/Platform.vue
#	resources/views/index.blade.php
#	src/App/Console/Commands/SetupWebsocketEnvironment.php
#	src/App/Users/Models/UserLimitation.php
#	src/Domain/RemoteUpload/Controllers/RemoteUploadFileController.php
#	src/Domain/RemoteUpload/Controllers/UploadFilesRemotelyForUploadRequestController.php
#	src/Domain/RemoteUpload/Controllers/VisitorRemoteUploadFileController.php
#	src/Domain/RemoteUpload/Requests/RemoteUploadRequest.php
#	src/Domain/Settings/Controllers/StoreBroadcastServiceCredentialsController.php
#	src/Domain/Settings/Controllers/StorePaymentServiceCredentialsController.php
#	src/Domain/SetupWizard/Controllers/StoreEnvironmentSettingsController.php
#	src/Domain/UploadRequest/Controllers/UploadFilesForUploadRequestController.php
#	src/Support/Upgrading/Controllers/UpgradingVersionsController.php

resources/js/components/Popups/ProcessingPopup.vue

@@ -1,13 +1,27 @@
 <template>
     <transition name="popup">
-        <div class="popup" v-if="processingPopup">
-            <div class="popup-wrapper">
-                <div class="popup-content">
-                    <div class="spinner-wrapper">
-                        <Spinner />
+        <div
+            v-if="processingPopup"
+            class="popup fixed top-0 left-0 right-0 bottom-0 z-50 grid h-full overflow-y-auto p-10 lg:absolute"
+        >
+            <div
+                class="fixed top-0 bottom-0 left-0 right-0 z-10 m-auto w-full bg-white shadow-xl dark:bg-dark-foreground md:relative md:w-[490px] md:rounded-xl"
+            >
+                <div
+                    class="flex h-full -translate-y-7 transform items-center justify-center px-8 text-center md:translate-y-0"
+                >
+                    <div>
+                        <div class="relative pb-16 pt-10">
+                            <Spinner />
+                        </div>
+
+                        <h1 v-if="processingPopup.title" class="mb-2 text-2xl font-bold">
+                            {{ processingPopup.title }}
+                        </h1>
+                        <p v-if="processingPopup.message" class="mb-4 text-sm">
+                            {{ processingPopup.message }}
+                        </p>
                     </div>
-                    <h1 class="title">{{ processingPopup.title }}</h1>
-                    <p class="message">{{ processingPopup.message }}</p>
                 </div>
             </div>
         </div>
@@ -17,10 +31,12 @@
 <script>
 import Spinner from '../UI/Others/Spinner'
 import { mapGetters } from 'vuex'
+import PopupWrapper from './Components/PopupWrapper'
 
 export default {
     name: 'ProcessingPopup',
     components: {
+        PopupWrapper,
         Spinner,
     },
     computed: {
@@ -28,107 +44,3 @@ export default {
     },
 }
 </script>
-
-<style scoped lang="scss">
-@import '../../../sass/vuefilemanager/variables';
-@import '../../../sass/vuefilemanager/mixins';
-
-.spinner-wrapper {
-    padding-bottom: 90px;
-    position: relative;
-}
-
-.popup {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    z-index: 20;
-    overflow: auto;
-    height: 100%;
-}
-
-.popup-wrapper {
-    z-index: 12;
-    position: absolute;
-    left: 0;
-    right: 0;
-    max-width: 480px;
-    top: 50%;
-    transform: translateY(-50%) scale(1);
-    margin: 0 auto;
-    padding: 20px;
-    box-shadow: $light_mode_popup_shadow;
-    border-radius: 8px;
-    text-align: center;
-    background: white;
-}
-
-.popup-content {
-    .title {
-        @include font-size(22);
-        font-weight: 700;
-        color: $text;
-    }
-
-    .message {
-        @include font-size(16);
-        color: #333;
-        margin-top: 5px;
-    }
-}
-
-@media only screen and (max-width: 690px) {
-    .popup-wrapper {
-        padding: 20px;
-        left: 15px;
-        right: 15px;
-    }
-
-    .popup-content {
-        .title {
-            @include font-size(19);
-        }
-
-        .message {
-            @include font-size(15);
-        }
-    }
-}
-
-.dark {
-    .popup-wrapper {
-        background: $dark_mode_foreground;
-    }
-    .popup-content {
-        .title {
-            color: $dark_mode_text_primary;
-        }
-
-        .message {
-            color: $dark_mode_text_secondary;
-        }
-    }
-}
-
-// Animations
-.popup-enter-active {
-    animation: popup-in 0.35s 0.15s ease both;
-}
-
-.popup-leave-active {
-    animation: popup-in 0.15s ease reverse;
-}
-
-@keyframes popup-in {
-    0% {
-        opacity: 0;
-        transform: scale(0.7);
-    }
-    100% {
-        opacity: 1;
-        transform: scale(1);
-    }
-}
-</style>