Fix markdown toggle & only show source copy button on hover

[Pilopa]

Proposed changes

A recent update added a button that lets users copy source code. In markdown files, the toggle button covers the copy button visually which does not look good and makes it hard/impossible to use. Additionally, larger markdown files with multiple code blocks have too many visible buttons that clutter the screen. This PR moves the markdown toggle above the actual display and only shows the copy button upon hovering the code that is to be copied.

Your checklist for this pull request

Put an x in the boxes that apply. You can also fill these out after creating the PR. If you're unsure about any of them, don't hesitate to ask. We're here to help! This is simply a reminder of what we are going to look for before merging your code.

Contributor:

• PR is well described and the description can be used as a commit message on squash
• Related issues linked to PR if existing and labels set
• Changelog entry file created in gradle/changelog

Reviewer:

• The clean code principles are respected (CleanCode)
• All new code/logic is implemented on the right spot / "Should this be done here?"
• UI changes fits into the layout
• The UI views / components are responsive (mobile views)
• Correct translations are available

Checklist for branch merge request (not required for forks)

• Branch is green/blue on Jenkins
• Quality Gate passed on SonarQube

[pfeuffer]

If the text has been copied from one code block, the button will no longer show up for other code blocks.

Change did not work the first time, after a reload it looked ok

[sonarcloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

100.0% Coverage
0.0% Duplication