From 1d9284e4285b2e4f0746e3041e48ae606286e182 Mon Sep 17 00:00:00 2001
From: Piyush <piyush.sawalkar@t-systems.com>
Date: Tue, 23 Jun 2026 12:52:19 +0000
Subject: [PATCH 1/3] resized the progress bar for mobile view

---
 css/apps/files.scss | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/css/apps/files.scss b/css/apps/files.scss
index 5a37339..491bd1e 100644
--- a/css/apps/files.scss
+++ b/css/apps/files.scss
@@ -470,7 +470,30 @@ table.files-filestable {
 			margin-right: 6rem;
     		margin-top: 23px;
 		}
+
+		// Responsive adjustment for upload progress bar
+		@media screen and (max-width: $breakpoint-mobile-small) {
+			.upload-picker__progress {
+				width: 140px !important;
+				max-width: 320px;
+				margin-right: 4rem !important;
+				padding: 1rem;
+				background: var(--color-main-background);
+				z-index: 1;
+				position: absolute;
+			}
+
+			.upload-picker__cancel {
+				z-index: 1;
+				position: absolute;
+				left: 3rem; 
+			}
+		}
 		
+		.files-list__breadcrumbs--with-progress {
+			flex-direction: row !important;
+		}
+
 		.files-list__refresh-icon {
 			position: absolute;
 			right: 13rem;

From 2a6f9a3d6e2abae12afaba6f5f245e302ed0a67f Mon Sep 17 00:00:00 2001
From: Piyush <piyush.sawalkar@t-systems.com>
Date: Mon, 29 Jun 2026 06:57:40 +0000
Subject: [PATCH 2/3] adjusting spaces for file upload progress bar for tab
 devices

---
 css/apps/files.scss | 30 ++++++++++++++++++++++++++++--
 1 file changed, 28 insertions(+), 2 deletions(-)

diff --git a/css/apps/files.scss b/css/apps/files.scss
index 491bd1e..12e7077 100644
--- a/css/apps/files.scss
+++ b/css/apps/files.scss
@@ -485,8 +485,34 @@ table.files-filestable {
 
 			.upload-picker__cancel {
 				z-index: 1;
-				position: absolute;
-				left: 3rem; 
+				position: relative;
+				left: -148px;
+				float: left;
+				padding: 0;
+				background: var(--color-main-background);
+			}
+			// .upload-picker__cancel {
+			// 	z-index: 1;
+			// 	position: absolute;
+			// 	left: 3rem; 
+			// }
+
+			.files-list__header-upload-button {
+				padding-left: 2rem;
+				background-color: var(--color-main-background);
+				z-index: 1;
+			}
+		}
+
+		@media (min-width: $breakpoint-mobile-small) and (max-width: $breakpoint-mobile-medium) {
+			.upload-picker__progress {
+				width: 310px;
+				max-width: 320px;
+				margin-right: 3rem;
+				margin-top: 23px;
+				padding: 1rem 0 1rem 1rem;
+				background: var(--color-main-background);
+				z-index: 1;
 			}
 		}
 		

From f9318d5993f46e3446ea481e3c0f0ba6fa4a6380 Mon Sep 17 00:00:00 2001
From: Piyush <piyush.sawalkar@t-systems.com>
Date: Thu, 2 Jul 2026 15:05:03 +0000
Subject: [PATCH 3/3] tabs and mobile progress are adjusted based on white and
 dark themes

---
 css/apps/files.scss              | 15 ++++++++-------
 css/components/ncbreadcrumb.scss |  6 ++++++
 2 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/css/apps/files.scss b/css/apps/files.scss
index 12e7077..b8a2713 100644
--- a/css/apps/files.scss
+++ b/css/apps/files.scss
@@ -463,7 +463,7 @@ table.files-filestable {
 		}
 
 		.upload-picker__progress {
-			width: 320px;
+			width: 300px;
 			max-width: 320px;
 			
 			//Adjusting the position of the progress bar to align with the secondary loader
@@ -491,11 +491,6 @@ table.files-filestable {
 				padding: 0;
 				background: var(--color-main-background);
 			}
-			// .upload-picker__cancel {
-			// 	z-index: 1;
-			// 	position: absolute;
-			// 	left: 3rem; 
-			// }
 
 			.files-list__header-upload-button {
 				padding-left: 2rem;
@@ -506,7 +501,7 @@ table.files-filestable {
 
 		@media (min-width: $breakpoint-mobile-small) and (max-width: $breakpoint-mobile-medium) {
 			.upload-picker__progress {
-				width: 310px;
+				width: 300px;
 				max-width: 320px;
 				margin-right: 3rem;
 				margin-top: 23px;
@@ -515,6 +510,12 @@ table.files-filestable {
 				z-index: 1;
 			}
 		}
+		@media (min-width: $breakpoint-mobile-medium) and (max-width: $breakpoint-mobile) { 
+			.upload-picker__progress {
+				margin-right: 2rem;
+				width: 260px;
+			}
+		}
 		
 		.files-list__breadcrumbs--with-progress {
 			flex-direction: row !important;
diff --git a/css/components/ncbreadcrumb.scss b/css/components/ncbreadcrumb.scss
index 2fff06f..9c57134 100644
--- a/css/components/ncbreadcrumb.scss
+++ b/css/components/ncbreadcrumb.scss
@@ -6,6 +6,12 @@
 
 	nav {
 		height: 44px;
+		margin: 0px 10px;
+		@media (min-width: $breakpoint-mobile-medium) and (max-width: $breakpoint-mobile) { 
+			nav {
+				flex-shrink: 0;
+			}
+		}
 
 		ul.breadcrumb__crumbs {
 			// Display root as "Start" text