From c7665b28f4068cc5149fe4188208fde92efb2647 Mon Sep 17 00:00:00 2001
From: "marcel.kocisek" <marcel.kocisek@lutraconsulting.co.uk>
Date: Wed, 27 Mar 2024 16:17:32 +0100
Subject: [PATCH 1/4] Add wider app-container with padding around on every
 breakpoint

---
 .../packages/lib/src/common/components/AppContainer.vue   | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/web-app/packages/lib/src/common/components/AppContainer.vue b/web-app/packages/lib/src/common/components/AppContainer.vue
index 50ef621a..51e24f45 100644
--- a/web-app/packages/lib/src/common/components/AppContainer.vue
+++ b/web-app/packages/lib/src/common/components/AppContainer.vue
@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
 
 <template>
   <!-- Padding equals 20px -->
-  <div class="app-container mx-auto pt-3 pb-1 px-3 xl:px-0">
+  <div class="app-container mx-auto pt-3 pb-1">
     <slot></slot>
   </div>
 </template>
@@ -15,7 +15,9 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
 
 <style scoped lang="scss">
 .app-container {
-  // From figma design
-  max-width: 1120px;
+  // From figma design + padding
+  max-width: 1150px;
+  padding-left: 15px;
+  padding-right: 15px;
 }
 </style>

From 5a13e6a3b82df9d7a667b5ed1b3e6705c42fc1fd Mon Sep 17 00:00:00 2001
From: "marcel.kocisek" <marcel.kocisek@lutraconsulting.co.uk>
Date: Wed, 27 Mar 2024 17:01:05 +0100
Subject: [PATCH 2/4] Footer adjustments for new pixel width

---
 .../src/modules/dashboard/components/DashboardFooter.vue  | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/web-app/packages/lib/src/modules/dashboard/components/DashboardFooter.vue b/web-app/packages/lib/src/modules/dashboard/components/DashboardFooter.vue
index 4cf5b5c1..c6b087d0 100644
--- a/web-app/packages/lib/src/modules/dashboard/components/DashboardFooter.vue
+++ b/web-app/packages/lib/src/modules/dashboard/components/DashboardFooter.vue
@@ -43,12 +43,12 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
             href="https://apps.apple.com/us/app/input/id1478603559?ls=1&utm_source=mergin-website&utm_medium=banner&utm_campaign=input"
             target="_blank"
             class="mr-1"
-            ><img src="@/assets/appstore.jpg"
+            ><img :style="{ width: '100%' }" src="@/assets/appstore.jpg"
           /></a>
           <a
             href="https://play.google.com/store/apps/details?id=uk.co.lutraconsulting&utm_source=mergin-website&utm_medium=banner&utm_campaign=input"
             target="_blank"
-            ><img src="@/assets/googleplay.jpg"
+            ><img :style="{ width: '100%' }" src="@/assets/googleplay.jpg"
           /></a>
         </div>
 
@@ -86,10 +86,10 @@ function closeElement() {
 .dashboard-view-footer-mobile {
   margin-top: -1.5rem;
   min-height: 100px;
-  width: 350px;
+  width: 320px;
 
   &-circle {
-    height: 350px;
+    height: 320px;
     background-color: var(--primary-color);
   }
 }

From db4b2d08d0adf29df117476fb3eda57700d3d625 Mon Sep 17 00:00:00 2001
From: "marcel.kocisek" <marcel.kocisek@lutraconsulting.co.uk>
Date: Wed, 27 Mar 2024 17:09:15 +0100
Subject: [PATCH 3/4] Cleanup gap from banner with image

---
 web-app/packages/lib/src/common/components/AppSectionBanner.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web-app/packages/lib/src/common/components/AppSectionBanner.vue b/web-app/packages/lib/src/common/components/AppSectionBanner.vue
index f6171b34..c6dff560 100644
--- a/web-app/packages/lib/src/common/components/AppSectionBanner.vue
+++ b/web-app/packages/lib/src/common/components/AppSectionBanner.vue
@@ -42,7 +42,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
             <div v-if="$slots['header-image']" class="flex align-items-center">
               <slot name="header-image"></slot>
             </div>
-            <div :class="['flex flex-column gap-2 lg:gap-1']">
+            <div :class="['flex flex-column gap-2 lg:gap-0']">
               <h3 class="text-color title-t3">
                 <slot name="title"></slot>
               </h3>

From 5308d316d0e49f95afe91af135fef250e0130eae Mon Sep 17 00:00:00 2001
From: "marcel.kocisek" <marcel.kocisek@lutraconsulting.co.uk>
Date: Wed, 27 Mar 2024 20:18:09 +0100
Subject: [PATCH 4/4] Silently upgrade styles for projects table and fix
 undefine MB

---
 .../lib/src/modules/project/components/ProjectsTable.vue      | 4 ++--
 .../lib/src/modules/project/views/FileBrowserView.vue         | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/web-app/packages/lib/src/modules/project/components/ProjectsTable.vue b/web-app/packages/lib/src/modules/project/components/ProjectsTable.vue
index 476d79a8..a414cb78 100644
--- a/web-app/packages/lib/src/modules/project/components/ProjectsTable.vue
+++ b/web-app/packages/lib/src/modules/project/components/ProjectsTable.vue
@@ -39,7 +39,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
           :pt="ptColumn"
         >
           <template #body="slotProps">
-            <p class="font-semibold paragraph-p5">
+            <p class="title-t4">
               <router-link
                 :to="{
                   name: 'project',
@@ -82,7 +82,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
                 value: $filters.datetime(slotProps.data.updated),
                 pt: { root: { 'data-cy': 'project-form-updated' } }
               }"
-              class="opacity-80 m-0"
+              class="opacity-80 m-0 paragraph-p7"
             >
               Updated {{ $filters.timediff(slotProps.data.updated) }}
             </span>
diff --git a/web-app/packages/lib/src/modules/project/views/FileBrowserView.vue b/web-app/packages/lib/src/modules/project/views/FileBrowserView.vue
index 0672ea70..c2b04dd8 100644
--- a/web-app/packages/lib/src/modules/project/views/FileBrowserView.vue
+++ b/web-app/packages/lib/src/modules/project/views/FileBrowserView.vue
@@ -125,7 +125,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
                   {{ $filters.timediff(item.mtime) }}
                 </span>
                 <span v-else class="opacity-80">{{
-                  $filters.filesize(item.size)
+                  item.size !== undefined ? $filters.filesize(item.size) : ''
                 }}</span>
               </div>
             </div>