From 69709a1a05f4f0a248532c0ccc00ae4533447656 Mon Sep 17 00:00:00 2001
From: talksik <patel.arjun50@gmail.com>
Date: Wed, 18 May 2022 08:45:44 -0500
Subject: [PATCH] fixing somethings but just a mess

---
 packages/desktop/src/styles/index.css                     | 8 ++++++++
 .../desktop/src/tree/protected/terminal/line/LineRow.tsx  | 2 +-
 .../src/tree/protected/terminal/panels/SidePanel.tsx      | 2 +-
 3 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/desktop/src/styles/index.css b/packages/desktop/src/styles/index.css
index e04f61c..5439243 100644
--- a/packages/desktop/src/styles/index.css
+++ b/packages/desktop/src/styles/index.css
@@ -69,3 +69,11 @@ button {
 ::-webkit-scrollbar-thumb:hover {
   background-color: #a8bbbf;
 }
+
+.scrollbar-left {
+  direction: rtl;
+}
+
+.direction-ltr {
+  direction: ltr;
+}
diff --git a/packages/desktop/src/tree/protected/terminal/line/LineRow.tsx b/packages/desktop/src/tree/protected/terminal/line/LineRow.tsx
index 5935506..f862f78 100644
--- a/packages/desktop/src/tree/protected/terminal/line/LineRow.tsx
+++ b/packages/desktop/src/tree/protected/terminal/line/LineRow.tsx
@@ -131,7 +131,7 @@ export default React.memo(function LineRow({
       onClick={handleActivateLine}
       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 
+      cursor-pointer transition-all relative z-50 rounded direction-ltr 
       ${isUserToggleTuned && ' bg-gray-100 shadow-2xl '}
       ${isSelected && ' bg-gray-200 scale-110 shadow-2xl translate-x-3 '}
       `}
diff --git a/packages/desktop/src/tree/protected/terminal/panels/SidePanel.tsx b/packages/desktop/src/tree/protected/terminal/panels/SidePanel.tsx
index 29faeb8..ee06145 100644
--- a/packages/desktop/src/tree/protected/terminal/panels/SidePanel.tsx
+++ b/packages/desktop/src/tree/protected/terminal/panels/SidePanel.tsx
@@ -99,7 +99,7 @@ export default function SidePanel() {
       )}
 
       {/* rest of the lines */}
-      <div className={'flex flex-col flex-1 mr-[-100px] pr-[100px] overflow-y-auto'}>
+      <div className={'flex flex-col flex-1 mr-[-100px] pr-[100px] overflow-y-auto scrollbar-left'}>
         {initialRoomsFetch.loading ? (
           <Skeleton />
         ) : (