@ryusei/light
Version:
<div align="center"> <a href="https://light.ryuseijs.com"> <img alt="RyuseiLight" src="https://light.ryuseijs.com/images/svg/logo.svg" width="70"> </a>
43 lines (37 loc) • 1.13 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Copy</title>
<link href="../../../../dist/css/themes/ryuseilight-ryusei.min.css" rel="stylesheet">
</head>
<body>
<h3>Copy</h3>
<pre class="copy">
Object.keys( object );
class Component {
constructor() {
}
}
const component = new Component();
</pre>
<h3>Changing Texts</h3>
<pre class="copy-change-text">
console.log( 'hi!' );
</pre>
<h3>Changing Duration</h3>
<pre class="copy-change-duration">
console.log( 'hi!' );
</pre>
<script src="../../../../dist/js/ryuseilight.min.js"></script>
<script src="../../../../dist/js/components/overlay.min.js"></script>
<script src="../../../../dist/js/components/copy.min.js"></script>
<script>
const ryuseilight = new RyuseiLight();
ryuseilight.apply( '.copy', { copy: true } );
ryuseilight.apply( '.copy-left', { copy: { position: 'topLeft' } } );
ryuseilight.apply( '.copy-change-text', { copy: { html: 'Copy to clipboard', activeHtml: 'Copied!' } } );
ryuseilight.apply( '.copy-change-duration', { copy: { duration: 3000 } } );
</script>
</body>
</html>