Skip to content

Commit

Permalink
feat(popover): add copy to clipboard for elements
Browse files Browse the repository at this point in the history
  • Loading branch information
Joxit committed Nov 21, 2023
1 parent e108b88 commit 4da1a03
Showing 1 changed file with 12 additions and 1 deletion.
13 changes: 12 additions & 1 deletion src/components/popover.riot
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
</div>
<div each="{ style in Object.keys(props.styleProps) }">
<template if="{ props.styleProps[style] }">
{ style }: <code>{ props.styleProps[style] }</code>
{ style }: <code onclick="{ copyToClipboard }">{ props.styleProps[style] }</code>
<span if="{ style.indexOf('color') > -1}" class="popover-color" color="{ props.styleProps[style] }"></span>
</template>
</div>
Expand All @@ -32,6 +32,13 @@
onUpdated(props, state) {
this.updateColors(props, state);
},
copyToClipboard(e) {
navigator.clipboard.writeText(e.target.innerHTML);
e.target.style['background-color'] = '#8bc34a';
setTimeout(() => {
e.target.style['background-color'] = null;
}, 4000);
},
};
</script>
<style>
Expand Down Expand Up @@ -93,5 +100,9 @@
height: 0.8rem;
background-color: #fff;
}
code {
cursor: pointer;
transition: background-color 0.5s ease-out;
}
</style>
</popover>

0 comments on commit 4da1a03

Please # to comment.