From fb23a82005d13fdc4ff113d54ed782348701ce12 Mon Sep 17 00:00:00 2001
From: Vitalii Stefaniv <deosplayt@gmail.com>
Date: Wed, 25 Sep 2024 17:17:28 +0300
Subject: [PATCH] fix: fixed inconsistent analytics page alignment gf-530

---
 .../libs/components/date-input/styles.module.css |  3 ++-
 apps/frontend/src/pages/analytics/analytics.tsx  | 16 +++++++++-------
 .../styles.module.css                            |  3 ++-
 .../src/pages/analytics/styles.module.css        |  8 +++++++-
 4 files changed, 20 insertions(+), 10 deletions(-)

diff --git a/apps/frontend/src/libs/components/date-input/styles.module.css b/apps/frontend/src/libs/components/date-input/styles.module.css
index 9aaa7376..4b55a901 100644
--- a/apps/frontend/src/libs/components/date-input/styles.module.css
+++ b/apps/frontend/src/libs/components/date-input/styles.module.css
@@ -98,7 +98,7 @@
 	display: flex;
 	gap: 8px;
 	align-items: center;
-	width: 270px;
+	max-width: 270px;
 	padding: 10px 16px;
 	color: inherit;
 	cursor: pointer;
@@ -120,6 +120,7 @@
 	font-weight: 400;
 	line-height: 1.5;
 	color: inherit;
+	text-overflow: ellipsis;
 	pointer-events: none;
 	background-color: transparent;
 	border: none;
diff --git a/apps/frontend/src/pages/analytics/analytics.tsx b/apps/frontend/src/pages/analytics/analytics.tsx
index 77734616..e05953b9 100644
--- a/apps/frontend/src/pages/analytics/analytics.tsx
+++ b/apps/frontend/src/pages/analytics/analytics.tsx
@@ -135,13 +135,15 @@ const Analytics = (): JSX.Element => {
 							placeholder="Select project"
 						/>
 					</div>
-					<DateInput
-						control={control}
-						maxDate={todayDate}
-						maxRange={ANALYTICS_DATE_MAX_RANGE}
-						minDate={minChoosableDate}
-						name="dateRange"
-					/>
+					<div className={styles["date-input-wrapper"]}>
+						<DateInput
+							control={control}
+							maxDate={todayDate}
+							maxRange={ANALYTICS_DATE_MAX_RANGE}
+							minDate={minChoosableDate}
+							name="dateRange"
+						/>
+					</div>
 				</form>
 				<AnalyticsTable
 					activityLogs={activityLogs}
diff --git a/apps/frontend/src/pages/analytics/libs/components/analytics-contributors-search/styles.module.css b/apps/frontend/src/pages/analytics/libs/components/analytics-contributors-search/styles.module.css
index b4774864..7788a8d2 100644
--- a/apps/frontend/src/pages/analytics/libs/components/analytics-contributors-search/styles.module.css
+++ b/apps/frontend/src/pages/analytics/libs/components/analytics-contributors-search/styles.module.css
@@ -1,4 +1,5 @@
 .search-container {
-	width: 300px;
+	width: 100%;
+	max-width: 300px;
 	background-color: var(--color-background-secondary);
 }
diff --git a/apps/frontend/src/pages/analytics/styles.module.css b/apps/frontend/src/pages/analytics/styles.module.css
index 81a9bbab..d521eeaa 100644
--- a/apps/frontend/src/pages/analytics/styles.module.css
+++ b/apps/frontend/src/pages/analytics/styles.module.css
@@ -13,5 +13,11 @@
 }
 
 .select-wrapper {
-	min-width: 270px;
+	width: 100%;
+	max-width: 270px;
+}
+
+.date-input-wrapper {
+	flex-grow: 1;
+	max-width: 270px;
 }