Merge pull request #6396 from backstage/mob/fix-code-scroll

[TechDocs] Add styles for scrollbars in long code blocks

.changeset/techdocs-lamp-lit-prose.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-techdocs': patch
+---
+
+Fixed bug preventing scroll bar from showing up on code blocks in a TechDocs site.

plugins/techdocs/src/reader/components/Reader.tsx

@@ -184,6 +184,17 @@ export const Reader = ({ entityId, onReady }: Props) => {
         }
         `,
       }),
+      injectCss({
+        // Properly style code blocks.
+        css: `
+        .md-typeset pre > code::-webkit-scrollbar-thumb {
+          background-color: hsla(0, 0%, 0%, 0.32);
+        }
+        .md-typeset pre > code::-webkit-scrollbar-thumb:hover {
+          background-color: hsla(0, 0%, 0%, 0.87);
+        }
+        `,
+      }),
       injectCss({
         // Admonitions and others are using SVG masks to define icons. These
         // masks are defined as CSS variables.