fix(techdocs): add focus+hover styling to codeblock CTC button (#29792)

* fix(techdocs): add aria-label to codeblock CTC button

Signed-off-by: logonoff <git@logonoff.co>

* fix(techdocs): add focus+hover styling to codeblock CTC button

Signed-off-by: logonoff <git@logonoff.co>

---------

Signed-off-by: logonoff <git@logonoff.co>

.changeset/thick-hotels-rhyme.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-techdocs': patch
+---
+
+Add hover and focus styling to the "copy to clipboard" button within codeblocks in techdocs. Also added an aria-label to the button for accessibility.

plugins/techdocs/src/reader/transformers/copyToClipboard.tsx

@@ -67,9 +67,10 @@ const CopyToClipboardButton = ({ text }: CopyToClipboardButtonProps) => {
       leaveDelay={1000}
     >
       <IconButton
-        style={{ color: 'inherit', position: 'absolute' }}
+        style={{ position: 'absolute' }}
         className="md-clipboard md-icon"
         onClick={handleClick}
+        aria-label="Copy to clipboard"
       >
         <CopyToClipboardIcon />
       </IconButton>