fix: scrollbars pick up the theme in dark mode

Signed-off-by: Navya Govind <ngovind@bol.com>

.changeset/proud-doors-cheat.md

@@ -0,0 +1,5 @@
+---
+'@backstage/theme': patch
+---
+
+Fixed bug where scrollbars don't pick up the theme when in dark mode

packages/theme/src/v5/defaultComponentThemes.ts

@@ -34,6 +34,22 @@ export const defaultComponentThemes: ThemeOptions['components'] = {
         overscrollBehaviorY: 'none',
         fontSize: '0.875rem',
         lineHeight: 1.43,
+        '&::-webkit-scrollbar, & *::-webkit-scrollbar': {
+          backgroundColor: theme.palette.background.paper,
+          width: '1em',
+        },
+        '&::-webkit-scrollbar-thumb, & *::-webkit-scrollbar-thumb': {
+          borderRadius: 8,
+          backgroundColor: theme.palette.textVerySubtle,
+          border: `3px solid ${theme.palette.background.paper}`,
+        },
+        '&::-webkit-scrollbar-thumb:active, & *::-webkit-scrollbar-thumb:active':
+          {
+            backgroundColor:
+              theme.palette.mode === 'dark'
+                ? lighten(theme.palette.textVerySubtle, 0.2)
+                : darken(theme.palette.textVerySubtle, 0.2),
+          },
       },
       a: {
         color: 'inherit',