From 953bc9d6d5818477e69caa79ce664fbadd3ae159 Mon Sep 17 00:00:00 2001
From: Greg Hurrell <greg@hurrell.net>
Date: Sat, 1 Aug 2015 19:47:38 -0700
Subject: [PATCH] Add icon for copy button

Got the SVG from: https://icomoon.io/app

Compressed it with svgo (`npm install -g svgo`; see
https://github.com/svg/svgo)

Converted to data URI with: https://gist.github.com/puppybits/1565441

Did consider skipping the base64-encoding step (ie.
https://css-tricks.com/probably-dont-base64-svg/) but decided against
it. It won't work in old browsers, and isn't much of a space saving
anyway.
---
 src/App.css        | 14 ++++++++++++++
 src/Field.react.js |  2 +-
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/App.css b/src/App.css
index c5cca08..97037bf 100644
--- a/src/App.css
+++ b/src/App.css
@@ -20,3 +20,17 @@ body {
   padding-right: 12px;
   text-align: right;
 }
+
+.hextrapolate-copy {
+  background-repeat: no-repeat;
+  background-size: 16px 16px;
+  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDMyIDMyIj48cGF0aCBmaWxsPSIjNDQ0IiBkPSJNMjAgOFYwSDZMMCA2djE4aDEydjhoMjBWOEgyMHpNNiAyLjgyOFY2SDIuODI4TDYgMi44Mjh6TTIgMjJWOGg2VjJoMTB2NmwtNiA2djhIMnptMTYtMTEuMTcyVjE0aC0zLjE3MkwxOCAxMC44Mjh6TTMwIDMwSDE0VjE2aDZ2LTZoMTB2MjB6Ii8+PC9zdmc+);
+  display: inline-block;
+  height: 16px;
+  margin-left: 8px;
+  overflow: hidden;
+  position: relative;
+  text-indent: -10000px;
+  top: 4px;
+  width: 16px;
+}
diff --git a/src/Field.react.js b/src/Field.react.js
index 2a67b01..31a0c9b 100644
--- a/src/Field.react.js
+++ b/src/Field.react.js
@@ -86,7 +86,7 @@ export default class Field extends React.Component {
     // doesn't work; see:
     // - https://code.google.com/p/chromium/issues/detail?id=476508
     // - https://github.com/w3c/clipboard-apis/issues/4
-    return <span onClick={this._onCopy}>copy</span>;
+    return <span className="hextrapolate-copy" onClick={this._onCopy}>copy</span>;
   }
 
   render() {
-- 
2.37.1