UX: Add copy button to theme public key (#13690)

UX: Add copy button to theme public key (#13690)

diff --git a/app/assets/javascripts/admin/addon/templates/modal/admin-install-theme.hbs b/app/assets/javascripts/admin/addon/templates/modal/admin-install-theme.hbs
index 78baeab..fcc7d7c 100644
--- a/app/assets/javascripts/admin/addon/templates/modal/admin-install-theme.hbs
+++ b/app/assets/javascripts/admin/addon/templates/modal/admin-install-theme.hbs
@@ -78,7 +78,10 @@
           {{#if showPublicKey}}
             <div class="public-key">
               <div class="label">{{i18n "admin.customize.theme.public_key"}}</div>
-              {{textarea readonly=true value=publicKey}}
+              <div class="public-key-text-wrapper">
+                {{textarea class="public-key-value" readonly=true value=publicKey}}
+                {{copy-button selector="textarea.public-key-value"}}
+              </div>
             </div>
           {{else}}
             {{#if privateChecked}}
diff --git a/app/assets/stylesheets/common/admin/customize.scss b/app/assets/stylesheets/common/admin/customize.scss
index 47a5e43..045235d 100644
--- a/app/assets/stylesheets/common/admin/customize.scss
+++ b/app/assets/stylesheets/common/admin/customize.scss
@@ -596,7 +596,6 @@
   }
   label input {
     width: auto;
-    margin: 3px 0;
   }
 }
 .public-key {
@@ -604,7 +603,17 @@
   textarea {
     cursor: auto;
     min-height: 220px;
+    margin-bottom: 0;
   }
+  button {
+    position: absolute;
+    top: 0;
+    right: 0;
+  }
+}
+
+.public-key-text-wrapper {
+  position: relative;
 }
 
 .public-key-note {

GitHub sha: 729a9856f87d01b24817be3dea330538e18c1e3e

This commit appears in #13690 which was approved by CvX. It was merged by awesomerobot.