Skip to content

Conversation

@Amogh1071
Copy link

Pull Request: Add Copy Button for Code Blocks in API Page

Issue: [feat] : Add button for copy code #326

Description

This pull request introduces a "Copy" button for code blocks on the Nightwatch API page. The feature enables users to easily copy code snippets with a single click, improving user experience and accessibility.

Changes Implemented

  1. Added a Copy button for each code block in the API page.
  2. Integrated the copyToClipboard functionality to handle the copy action.
  3. Styled the button to be interactive, with hover effects and feedback on successful copy action.

Preview of Added Code Block:

<div class="sample-test" style="max-width:800px; position: relative;">
  <pre data-language="javascript" class="language-javascript"><code class="language-javascript">module.exports = {
    demoTest: function (browser) {
      browser.init();
    }
  };</code>
  </pre>
  <button class="copy-btn" onclick="copyToClipboard(this)">Copy</button>
</div>

PREVIEW VIDEO OF THE WEBSITE

Untitled.video.-.Made.with.Clipchamp.mp4

Related Issues

  • If there are any related issues or tickets, mention them here (e.g., Fixes #1234).

Checklist

  • Code changes tested and verified.
  • Button functionality confirmed on different browsers.
  • Styling tested on desktop and mobile views.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant