From fa8e7e434a0135095a5f6ac2e46ced8c5255c784 Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Fri, 9 Jun 2023 16:45:58 +0200
Subject: [PATCH] fix(ui): user events styles feedback

---
 .../components/Session_/EventsBlock/Event.tsx    |  2 +-
 .../Session_/EventsBlock/EventGroupWrapper.js    | 16 ++++++++--------
 .../Session_/EventsBlock/event.module.css        |  2 +-
 3 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/frontend/app/components/Session_/EventsBlock/Event.tsx b/frontend/app/components/Session_/EventsBlock/Event.tsx
index 21e502863..5cfd6a8e9 100644
--- a/frontend/app/components/Session_/EventsBlock/Event.tsx
+++ b/frontend/app/components/Session_/EventsBlock/Event.tsx
@@ -177,7 +177,7 @@ const Event: React.FC<Props> = ({
         [cls.frustration]: isFrustration,
         [cls.highlight]: presentInSearch,
         [cls.lastInGroup]: whiteBg,
-        ['mx-4 rounded']: event.type !== TYPES.LOCATION
+        ['pl-6 ml-4 py-2 border-l']: event.type !== TYPES.LOCATION
       })}
       onClick={onClick}
       onContextMenu={onContextMenu}
diff --git a/frontend/app/components/Session_/EventsBlock/EventGroupWrapper.js b/frontend/app/components/Session_/EventsBlock/EventGroupWrapper.js
index b75c9bcd7..cff9c8778 100644
--- a/frontend/app/components/Session_/EventsBlock/EventGroupWrapper.js
+++ b/frontend/app/components/Session_/EventsBlock/EventGroupWrapper.js
@@ -72,12 +72,12 @@ class EventGroupWrapper extends React.Component {
         <div
           className={cn(
             {
-              [stl.last]: isLastInGroup,
-              [stl.first]: event.type === TYPES.LOCATION,
-              [stl.dashAfter]: isLastInGroup && !isLastEvent
+              // [stl.last]: isLastInGroup,
+              // [stl.first]: event.type === TYPES.LOCATION,
+              // [stl.dashAfter]: isLastInGroup && !isLastEvent
             },
-            isLastInGroup && '!pb-2',
-            event.type === TYPES.LOCATION && '!pb-2'
+            // isLastInGroup && '!pb-2',
+            // event.type === TYPES.LOCATION && '!pb-2'
           )}
         >
           {isFirst && isLocation && event.referrer && (
@@ -124,7 +124,7 @@ class EventGroupWrapper extends React.Component {
             />
           )}
         </div>
-        {(isLastInGroup && !isTabChange) && <div className='border-t border-color-gray-light-shade' />}
+        {(isLastInGroup && !isTabChange) && <div className='border-color-gray-light-shade' />}
       </>
     );
   }
@@ -137,7 +137,7 @@ function TabChange({ from, to, activeUrl, onClick }) {
     return (
         <div
             onClick={onClick}
-            className={'p-2 cursor-pointer bg-gray-lightest w-full border-gray-light border-t border-b !border-l-0 !border-r-0'}
+            className={'cursor-pointer bg-gray-lightest w-full py-2 border-b hover:bg-active-blue'}
         >
             <div className={'flex items-center gap-2 px-4'}>
               <span style={{ fontWeight: 500 }}>
@@ -148,7 +148,7 @@ function TabChange({ from, to, activeUrl, onClick }) {
                 {to}
               </span>
             </div>
-            <div className={'break-words mt-1 px-4 text-sm font-normal color-gray-medium'}>
+            <div className={'break-words mt-1 px-4 text-sm font-normal color-gray-medium whitespace-nowrap'}>
                 {activeUrl}
             </div>
         </div>
diff --git a/frontend/app/components/Session_/EventsBlock/event.module.css b/frontend/app/components/Session_/EventsBlock/event.module.css
index 76d9d9e44..5983cf6fb 100644
--- a/frontend/app/components/Session_/EventsBlock/event.module.css
+++ b/frontend/app/components/Session_/EventsBlock/event.module.css
@@ -29,7 +29,7 @@
   & .topBlock {
     min-height: 30px;
     position: relative;
-    padding: 8px 10px;
+    padding: 8px 0px;
   }
 
   & .checkbox {