Merge pull request #239 from Authress-Engineering/improve-copy-display

Fix copy button sizing in syntax toolbar.

CHANGELOG.md

@@ -5,6 +5,7 @@ This package follows standard semvar, `<major>.<minor>.<build>`. No breaking cha
 * The `table` view is now the default as the `tree` view becomes deprecated. To display the `tree` view, use the `tree` attribute on the openapi-explorer html element.
 * Handle invalid JSON parsing in request bodies
 * Fix the request body that keeps changing preventing editing of it.
+* Set min height on syntax rendering to be 2rem, so that the copy button always fully shows correctly.
 
 ## 2.1
 * Add `x-locale` vendor extension to specify the locale of the spec.

src/components/api-request.js

@@ -635,7 +635,7 @@ export default class ApiRequest extends LitElement {
           <syntax-highlighter language="http" .content="${this.responseHeaders}"/>
         </div>
         <div class="tab-content m-markdown col" style="flex:1;display:${this.activeResponseTab === 'curl' ? 'flex' : 'none'};">
-          <syntax-highlighter class="fs-exclude" data-hj-suppress data-sl="mask" language="shell" .content="${curlSyntax.trim()}"/>
+          <syntax-highlighter language="shell" .content="${curlSyntax.trim()}"/>
         </div>
       </div>`;
   }

src/components/syntax-highlighter.js

@@ -124,7 +124,7 @@ class SyntaxHighlighter extends LitElement {
    * @returns Content
    */
   renderCopyWrapper(content) {
-    return html`<div>
+    return html`<div class="fs-exclude" data-hj-suppress data-sl="mask" style="min-height: 2rem;">
       <button 
         class="m-btn outline-primary toolbar-copy-btn" 
         @click='${this.copyToClipboard}'