From ac4154d48c341361dc1820a6509231e8bf9de9e8 Mon Sep 17 00:00:00 2001
From: cedric karungu <ckarungu921@gmail.com>
Date: Tue, 12 Dec 2023 21:41:53 +0200
Subject: [PATCH] feat: add responsive to profile timer sections

---
 apps/web/lib/features/task/task-filters.tsx | 8 ++++----
 apps/web/lib/features/timer/timer.tsx       | 2 +-
 apps/web/lib/features/user-nav-menu.tsx     | 2 +-
 apps/web/pages/profile/[memberId].tsx       | 2 +-
 4 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/apps/web/lib/features/task/task-filters.tsx b/apps/web/lib/features/task/task-filters.tsx
index 77a580cea..638d031e5 100644
--- a/apps/web/lib/features/task/task-filters.tsx
+++ b/apps/web/lib/features/task/task-filters.tsx
@@ -348,28 +348,28 @@ function TaskStatusFilter({ hook }: { hook: I_TaskFilter }) {
 				<TaskStatusDropdown
 					key={key + 1}
 					onValueChange={(_, values) => hook.onChangeStatusFilter('status', values || [])}
-					className="lg:min-w-[170px] mt-4 lg:mt-0"
+					className="lg:min-w-[170px] mt-4 mb-2 lg:mt-0"
 					multiple={true}
 				/>
 
 				<TaskPropertiesDropdown
 					key={key + 2}
 					onValueChange={(_, values) => hook.onChangeStatusFilter('priority', values || [])}
-					className="lg:min-w-[170px] mt-4 lg:mt-0"
+					className="lg:min-w-[170px] mt-4 mb-2 lg:mt-0"
 					multiple={true}
 				/>
 
 				<TaskSizesDropdown
 					key={key + 3}
 					onValueChange={(_, values) => hook.onChangeStatusFilter('size', values || [])}
-					className="lg:min-w-[170px] mt-4 lg:mt-0"
+					className="lg:min-w-[170px] mt-4 mb-2 lg:mt-0"
 					multiple={true}
 				/>
 
 				<TaskLabelsDropdown
 					key={key + 4}
 					onValueChange={(_, values) => hook.onChangeStatusFilter('label', values || [])}
-					className="lg:min-w-[170px] mt-4 lg:mt-0"
+					className="lg:min-w-[170px] mt-4 mb-2 lg:mt-0"
 					multiple={true}
 				/>
 
diff --git a/apps/web/lib/features/timer/timer.tsx b/apps/web/lib/features/timer/timer.tsx
index 8f5d37bfb..076914bb0 100644
--- a/apps/web/lib/features/timer/timer.tsx
+++ b/apps/web/lib/features/timer/timer.tsx
@@ -58,7 +58,7 @@ export function Timer({ className }: IClassName) {
 	useHotkeys(HostKeys.START_STOP_TIMER, handleStartSTOPTimer);
 
 	return (
-		<div className={clsxm('flex flex-row mb-12 2xl:mb-0', className)}>
+		<div className={clsxm('flex flex-row mb-6 md:mb-12 2xl:mb-0', className)}>
 			<div className="flex items-start justify-between border-r-[2px] dark:border-r-[#28292F] pr-5">
 				<div className="w-[11rem]">
 					<Text.Heading
diff --git a/apps/web/lib/features/user-nav-menu.tsx b/apps/web/lib/features/user-nav-menu.tsx
index 4b0dc9f97..e70286735 100644
--- a/apps/web/lib/features/user-nav-menu.tsx
+++ b/apps/web/lib/features/user-nav-menu.tsx
@@ -275,8 +275,8 @@ function UserNavMenu() {
 					{isTeamMember && isTeamDropdownAllowed ? <TeamsDropDown publicTeam={publicTeam || false} /> : null}
 
 					<KeyboardShortcuts />
+					<Divider className="mt-1 mb-3 w-full" />
 				</ul>
-				<Divider className="mt-4 mb-3" />
 				<ul className="w-full">
 					{/* Logout menu */}
 					<li>
diff --git a/apps/web/pages/profile/[memberId].tsx b/apps/web/pages/profile/[memberId].tsx
index 5f050b3e1..1a27ff937 100644
--- a/apps/web/pages/profile/[memberId].tsx
+++ b/apps/web/pages/profile/[memberId].tsx
@@ -43,7 +43,7 @@ const Profile = () => {
 					</div>
 
 					{/* User Profile Detail */}
-					<div className="flex flex-col items-center justify-between py-10 xs:flex-row">
+					<div className="flex flex-col items-center justify-between py-5 md:py-10 md:flex-row">
 						<UserProfileDetail member={profile.member} />
 
 						{profileIsAuthUser && isTrackingEnabled && (