Add copy to clipboard functionality

[XhmikosR]

TODO:

• change btn-clipboard text on success
• figure out how to handle the error case
• maybe move inline JS to a common file
• make sure the SCSS changes are fine

Fixes #3.

Preview: https://deploy-preview-182--bootstrap-icons.netlify.com/

[XhmikosR]

I made some progress. Basically the only thing left is how to handle the error case. The error message is big and won't look good if we use it as the button's text.

Any ideas welcome 🙂

[XhmikosR]

@mdo: thoughts?

[mdo]

Looks good when it works! What's the long error message we have, and can it be shortened?

[XhmikosR]

What do you mean with "When it works"? When doesn't it work for you? :)

The error message is https://github.com/twbs/icons/pull/182/files#diff-421b283055e51a6d67742686e9fdc865R88

In this case, I was thinking maybe just select the code and don't show any error. Or we have a new paragraph/div bellow the snippet and we show it in case of an error?

You can experiment with this by changing the error handler https://github.com/twbs/icons/pull/182/files#diff-421b283055e51a6d67742686e9fdc865R86 to success temporarily and clicking the copy button

[XhmikosR]

I pushed a patch for the error case. To try it, just change clipboard.on('error' to clipboard.on('success'

[MartijnCuppens]

Do we still need Clipboard.js? Can't we just rely on native js?

[XhmikosR]

I'd rather keep it. The discussion here is about the styles mostly not what we will use behind the scenes.

…

On Sun, Apr 5, 2020, 11:33 Martijn Cuppens ***@***.***> wrote: Do we still need Clipboard.js? Can't we just rely on native js? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#182 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AACVLNORSU5HZCSZTWWK45LRLA65FANCNFSM4LTKFZNQ> .

[bastienmoulia]

Big fan of the feature, but not the current UI.

Can't find it at first because it's over the code:

[XhmikosR]

I guess we could try showing when copying over the SVGs. PRs welcome and please open a new issue to track the request.