From 19041ffedd0ab29b6bfd7c000300090c5967b8c1 Mon Sep 17 00:00:00 2001
From: MokireddySampath <120497218+MokireddySampath@users.noreply.github.com>
Date: Thu, 17 Aug 2023 23:11:25 +0530
Subject: [PATCH] Border at the bottom has been added  for the tabs to
 differntiate from unselected tabs (#1509)

* Border at the bottom has been added  for the tabs to differntiate from unselected tabs while using contrast themes

* Update Tabs.tsx

* Update Tabs.tsx
---
 src/Explorer/Tabs/Tabs.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/Explorer/Tabs/Tabs.tsx b/src/Explorer/Tabs/Tabs.tsx
index 7273c5829..fc80a4f89 100644
--- a/src/Explorer/Tabs/Tabs.tsx
+++ b/src/Explorer/Tabs/Tabs.tsx
@@ -127,7 +127,12 @@ function TabNav({ tab, active, tabKind }: { tab?: Tab; active: boolean; tabKind?
               />
             )}
           </span>
-          <span className="tabNavText">{useObservable(tab?.tabTitle || getReactTabTitle())}</span>
+          <span
+            className="tabNavText"
+            style={active ? { fontWeight: "bolder", borderBottom: "2px solid rgba(0,120,212,1)" } : {}}
+          >
+            {useObservable(tab?.tabTitle || getReactTabTitle())}
+          </span>
           {tabKind !== ReactTabKind.Home && (
             <span className="tabIconSection">
               <CloseButton tab={tab} active={active} hovering={hovering} tabKind={tabKind} />