JSFiddle - React, Tailwind, and code Playground
HTML
<github-link></github-link>
CSS
github-link {
font-family: monospace;
font-size: 16px;
}
JavaScript
class GitHubLink extends HTMLElement {
constructor() {
super();
}
createdCallback() {
this._createRoot();
}
attachedCallback() {
let a = document.createElement('a');
a.textContent = 'GitHub profile';
a.href= 'https://github.com/jeremenichelli';
this.root.appendChild(a);
}
_createRoot() {
this.root = this.createShadowRoot();
}
}
document.registerElement('github-link', GitHubLink);