cleaner line history and right now?

packages/desktop/src/tree/protected/terminal/panels/MainPanel.tsx

@@ -181,7 +181,11 @@ function LineDetails() {
           <span>right now</span>
         </span>
 
-        <div className={'rounded flex flex-col items-center gap-2 w-full p-2 shadow-2xl'}>
+        <div
+          className={
+            'rounded flex flex-col items-center gap-2 w-full p-2 shadow-2xl border border-teal-500'
+          }
+        >
           {selectedLine.otherUserObjects.map((otherUser) => (
             <div
               key={`linehistory-${otherUser.name}`}
@@ -189,11 +193,11 @@ function LineDetails() {
             >
               <Avatar src={otherUser.picture} shape="square" size={'large'} />
 
-              <span key={`chunk-${otherUser.name}`} className="text-gray-500">
-                {`${otherUser.givenName}`}
+              <span key={`chunk-${otherUser.name}`} className="text-gray-600 font-semibold">
+                {`${otherUser.name}`}
               </span>
 
-              <span className="text-gray-600 text-md">
+              <span className="text-gray-600 text-md ml-auto">
                 <FiHeadphones />
               </span>
             </div>

packages/desktop/src/tree/protected/terminal/panels/SidePanel.tsx

@@ -218,7 +218,7 @@ function LineRowTest({
       role={'presentation'}
       className={`flex flex-row items-center justify-start gap-2 px-4 py-4 hover:bg-gray-200 
       cursor-pointer transition-all relative z-50 rounded ${
-        isSelected && 'bg-gray-200 scale-110 shadow-2xl translate-x-2'
+        isSelected && 'bg-gray-200 scale-110 shadow-2xl translate-x-3'
       }`}
     >
       {/* status dot */}