upload request prototype UI

resources/js/components/Admin/AppInputButton.vue

@@ -1,5 +1,8 @@
 <template>
-    <div :class="{ 'sm:mb-7 mb-6': !isLast }" class="w-full justify-between space-y-4 sm:flex sm:space-x-8 sm:space-x-2 sm:space-y-0">
+    <div
+        :class="{ 'mb-6 sm:mb-7': !isLast }"
+        class="w-full justify-between space-y-4 sm:flex sm:space-x-8 sm:space-x-2 sm:space-y-0"
+    >
         <!--Label for input-->
         <div class="leading-5">
             <label class="mb-1.5 block text-sm font-bold text-gray-700 dark:text-gray-200"> {{ title }}: </label>

resources/js/components/Admin/AppInputSwitch.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="{ 'sm:mb-7 mb-6': !isLast }" class="flex w-full items-center justify-between space-x-2 sm:space-x-8">
+    <div :class="{ 'mb-6 sm:mb-7': !isLast }" class="flex w-full items-center justify-between space-x-2 sm:space-x-8">
         <!--Label for input-->
         <div class="leading-5">
             <label class="mb-1.5 block text-sm font-bold text-gray-700 dark:text-gray-200"> {{ title }}: </label>

resources/js/components/Admin/AppInputText.vue

@@ -1,7 +1,9 @@
 <template>
-    <div :class="{ 'sm:mb-7 mb-6': !isLast }">
+    <div :class="{ 'mb-6 sm:mb-7': !isLast }">
         <!--Label for input-->
-        <label v-if="title" class="mb-1.5 block text-sm font-bold text-gray-700 dark:text-gray-200"> {{ title }}: </label>
+        <label v-if="title" class="mb-1.5 block text-sm font-bold text-gray-700 dark:text-gray-200">
+            {{ title }}:
+        </label>
 
         <!--Form element-->
         <slot />

resources/js/components/Admin/CardNavigation.vue

@@ -2,7 +2,8 @@
     <div id="card-navigation" style="height: 62px" class="mb-7">
         <div
             :class="{
-                'fixed top-0 left-0 right-0 z-10 rounded-none bg-white bg-opacity-50 px-6 backdrop-blur-lg backdrop-filter dark:bg-dark-foreground': fixedNav,
+                'fixed top-0 left-0 right-0 z-10 rounded-none bg-white bg-opacity-50 px-6 backdrop-blur-lg backdrop-filter dark:bg-dark-foreground':
+                    fixedNav,
             }"
         >
             <div class="overflow-x-auto whitespace-nowrap">

resources/js/components/Admin/ProgressLine.vue

@@ -16,7 +16,8 @@
                     v-if="data.length === 1"
                     :class="[
                         {
-                            'rounded-tl-lg rounded-bl-lg border-r-2 border-white dark:border-gray-800': chart.progress < 100,
+                            'rounded-tl-lg rounded-bl-lg border-r-2 border-white dark:border-gray-800':
+                                chart.progress < 100,
                             'rounded-lg border-none': chart.progress >= 100,
                         },
                         chart.color,

resources/js/components/Admin/WidgetLatestRegistrations.vue

@@ -1,8 +1,17 @@
 <template>
-    <DatatableWrapper @init="isLoading = false" api="/api/admin/dashboard/newbies" :paginator="false" :columns="columns" class="mt-6 overflow-x-auto">
+    <DatatableWrapper
+        @init="isLoading = false"
+        api="/api/admin/dashboard/newbies"
+        :paginator="false"
+        :columns="columns"
+        class="mt-6 overflow-x-auto"
+    >
         <template slot-scope="{ row }">
             <!--Not a subscription-->
-            <tr v-if="config.subscriptionType === 'none'" class="whitespace-nowrap border-b border-dashed border-light dark:border-opacity-5">
+            <tr
+                v-if="config.subscriptionType === 'none'"
+                class="whitespace-nowrap border-b border-dashed border-light dark:border-opacity-5"
+            >
                 <td class="py-3 pr-3 md:pr-1">
                     <router-link
                         :to="{
@@ -13,7 +22,10 @@
                         <div class="flex items-center">
                             <MemberAvatar :is-border="false" :size="44" :member="row.data.relationships.settings" />
                             <div class="ml-3 pr-10">
-                                <b class="max-w-1 block overflow-hidden text-ellipsis whitespace-nowrap text-sm font-bold" style="max-width: 155px">
+                                <b
+                                    class="max-w-1 block overflow-hidden text-ellipsis whitespace-nowrap text-sm font-bold"
+                                    style="max-width: 155px"
+                                >
                                     {{ row.data.relationships.settings.data.attributes.name }}
                                 </b>
                                 <span class="block text-xs text-gray-600 dark:text-gray-500">
@@ -70,7 +82,10 @@
             </tr>
 
             <!--Fixed subscription-->
-            <tr v-if="config.subscriptionType === 'fixed'" class="whitespace-nowrap border-b border-dashed border-light dark:border-opacity-5">
+            <tr
+                v-if="config.subscriptionType === 'fixed'"
+                class="whitespace-nowrap border-b border-dashed border-light dark:border-opacity-5"
+            >
                 <td class="py-3 pr-3 md:pr-1">
                     <router-link
                         :to="{
@@ -81,7 +96,10 @@
                         <div class="flex items-center">
                             <MemberAvatar :is-border="false" :size="44" :member="row.data.relationships.settings" />
                             <div class="ml-3 pr-10">
-                                <b class="max-w-1 block overflow-hidden text-ellipsis whitespace-nowrap text-sm font-bold" style="max-width: 155px">
+                                <b
+                                    class="max-w-1 block overflow-hidden text-ellipsis whitespace-nowrap text-sm font-bold"
+                                    style="max-width: 155px"
+                                >
                                     {{ row.data.relationships.settings.data.attributes.name }}
                                 </b>
                                 <span class="block text-xs text-gray-600 dark:text-gray-500">
@@ -143,7 +161,10 @@
             </tr>
 
             <!--Metered subscription-->
-            <tr v-if="config.subscriptionType === 'metered'" class="whitespace-nowrap border-b border-dashed border-light dark:border-opacity-5">
+            <tr
+                v-if="config.subscriptionType === 'metered'"
+                class="whitespace-nowrap border-b border-dashed border-light dark:border-opacity-5"
+            >
                 <td class="py-3 pr-3 md:pr-1">
                     <router-link
                         :to="{
@@ -154,7 +175,10 @@
                         <div class="flex items-center">
                             <MemberAvatar :is-border="false" :size="44" :member="row.data.relationships.settings" />
                             <div class="ml-3 pr-10">
-                                <b class="max-w-1 block overflow-hidden text-ellipsis whitespace-nowrap text-sm font-bold" style="max-width: 155px">
+                                <b
+                                    class="max-w-1 block overflow-hidden text-ellipsis whitespace-nowrap text-sm font-bold"
+                                    style="max-width: 155px"
+                                >
                                     {{ row.data.relationships.settings.data.attributes.name }}
                                 </b>
                                 <span class="block text-xs text-gray-600 dark:text-gray-500">

resources/js/components/Admin/WidgetLatestTransactions.vue

@@ -11,7 +11,10 @@
                     <div v-if="row.data.relationships.user" class="flex items-center">
                         <MemberAvatar :is-border="false" :size="36" :member="row.data.relationships.user" />
                         <div class="ml-3 pr-10">
-                            <b class="max-w-1 block overflow-hidden text-ellipsis whitespace-nowrap text-sm font-bold" style="max-width: 155px">
+                            <b
+                                class="max-w-1 block overflow-hidden text-ellipsis whitespace-nowrap text-sm font-bold"
+                                style="max-width: 155px"
+                            >
                                 {{ row.data.relationships.user.data.attributes.name }}
                             </b>
                             <span class="block text-xs text-gray-600 dark:text-gray-500">
@@ -24,10 +27,16 @@
                     </span>
                 </td>
                 <td class="px-3 md:px-1">
-                    <ColorLabel v-if="config.subscriptionType === 'fixed'" :color="$getTransactionStatusColor(row.data.attributes.status)">
+                    <ColorLabel
+                        v-if="config.subscriptionType === 'fixed'"
+                        :color="$getTransactionStatusColor(row.data.attributes.status)"
+                    >
                         {{ row.data.attributes.status }}
                     </ColorLabel>
-                    <ColorLabel v-if="config.subscriptionType === 'metered'" :color="$getTransactionTypeColor(row.data.attributes.type)">
+                    <ColorLabel
+                        v-if="config.subscriptionType === 'metered'"
+                        :color="$getTransactionTypeColor(row.data.attributes.type)"
+                    >
                         {{ row.data.attributes.type }}
                     </ColorLabel>
                 </td>
@@ -43,7 +52,11 @@
                 </td>
                 <td class="pl-3 md:pl-1">
                     <div class="w-32 text-right md:w-full">
-                        <img class="w-32 md:inline-block" :src="$getPaymentLogo(row.data.attributes.driver)" :alt="row.data.attributes.driver" />
+                        <img
+                            class="w-32 md:inline-block"
+                            :src="$getPaymentLogo(row.data.attributes.driver)"
+                            :alt="row.data.attributes.driver"
+                        />
                     </div>
                 </td>
             </tr>