dzikoyskGH-1910 Remove unnecessary paddings from dashboard view on m…

…obile & improve statuses (dzikoysk#2160)
CoPokBl · Jul 3, 2024 · 03b607e · 03b607e
1 parent 01888f4
commit 03b607e
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 3 deletions.
diff --git a/reposilite-frontend/src/components/dashboard/DashboardBox.vue b/reposilite-frontend/src/components/dashboard/DashboardBox.vue
@@ -18,7 +18,7 @@ defineProps({
 </script>
 
 <template>
-  <div class="py-3 w-1/6 mx-4 text-center border-2 border-xl rounded-xl border-gray-700">
+  <div class="py-3 w-1/6 mx-4 text-center border-2 border-xl rounded-xl border-gray-700 <sm:(h-16 w-full flex flex-col justify-center mb-2 mx-0)">
     <a v-if="link" :href="link" target="_blank">
       <div class="flex text-blue-500 w-full justify-center">
         <h1 class="text-md pt-1">{{title}}</h1>

diff --git a/reposilite-frontend/src/components/dashboard/DashboardView.vue b/reposilite-frontend/src/components/dashboard/DashboardView.vue
@@ -12,7 +12,7 @@ defineProps({
 </script>
 
 <template>
-  <div class="container mx-auto pt-6 px-15 pb-10 text-xs">
+  <div class="container mx-auto pt-6 px-15 pb-10 text-xs <sm:px-2 ">
     <div class="flex">
       <h1 class="font-bold pb-6 text-lg">Instance status</h1>
       <p class="text-3xl text-green-500 px-3 -mt-1 font-bold">•</p>

diff --git a/reposilite-frontend/src/components/dashboard/InstanceStatusCharts.vue b/reposilite-frontend/src/components/dashboard/InstanceStatusCharts.vue
@@ -47,7 +47,7 @@ const prettyUptime = (seconds) => {
 
 <template>
   <div v-if="instanceStatus">
-    <div class="flex w-full">
+    <div class="flex w-full <sm:flex-wrap justify-center">
       <DashboardBox 
         title="Version"
         :content="instanceStatus.version"