refactor(renderer): simplify sidebar appearance

Signed-off-by: Kristóf Marussy <kristof@marussy.com>

3 files changed, 7 insertions, 7 deletions

diff --git a/packages/renderer/src/components/sidebar/ServiceIcon.tsx b/packages/renderer/src/components/sidebar/ServiceIcon.tsx
index f3f025a..43af40b 100644
--- a/packages/renderer/src/components/sidebar/ServiceIcon.tsx
+++ b/packages/renderer/src/components/sidebar/ServiceIcon.tsx
@@ -59,7 +59,6 @@ const ServiceIconText = styled('div', {
 
 const ServiceIconBadgeBase = styled(Badge)({
   '& > .MuiBadge-badge': {
-    // Place badge above the sidebar inner shadow.
     zIndex: 200,
   },
 });
diff --git a/packages/renderer/src/components/sidebar/ServiceSwitcher.tsx b/packages/renderer/src/components/sidebar/ServiceSwitcher.tsx
index 56487df..4261205 100644
--- a/packages/renderer/src/components/sidebar/ServiceSwitcher.tsx
+++ b/packages/renderer/src/components/sidebar/ServiceSwitcher.tsx
@@ -40,6 +40,7 @@ const ServiceSwitcherRoot = styled(Tabs, {
   '.MuiTabs-indicator': {
     left: 0,
     right: 'auto',
+    width: 4,
   },
 });
 
@@ -55,7 +56,7 @@ const ServiceSwitcherTab = styled(Tab, {
   '&.Mui-selected': {
     backgroundColor:
       theme.palette.mode === 'dark'
-        ? alpha(theme.palette.text.primary, 0.13)
+        ? alpha(theme.palette.text.primary, 0.1)
         : alpha(theme.palette.primary.light, 0.24),
   },
 }));
diff --git a/packages/renderer/src/components/sidebar/Sidebar.tsx b/packages/renderer/src/components/sidebar/Sidebar.tsx
index 7308900..35b6f06 100644
--- a/packages/renderer/src/components/sidebar/Sidebar.tsx
+++ b/packages/renderer/src/components/sidebar/Sidebar.tsx
@@ -45,12 +45,12 @@ const SidebarRoot = styled(Box)(({ theme }) => ({
   '::after': {
     content: '" "',
     position: 'absolute',
-    top: '-20px',
-    bottom: '-20px',
-    right: '-20px',
+    top: 0,
+    bottom: 0,
+    right: 0,
+    width: 0,
     zIndex: 100,
-    width: '20px',
-    boxShadow: theme.shadows[4],
+    borderLeft: `1px solid ${theme.palette.divider}`,
   },
 }));