Skip to content

Instantly share code, notes, and snippets.

@kyleconroy

kyleconroy/web-components-go.html

Created August 21, 2020 20:16
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save kyleconroy/158499f420f8c90d2f2704a610fcb57b to your computer and use it in GitHub Desktop.
Save kyleconroy/158499f420f8c90d2f2704a610fcb57b to your computer and use it in GitHub Desktop.
Download ZIP
Raw
web-components-go.html
<!-- Input Go template -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Pop-up info box — web components</title>
<script src="main.js" defer></script>
</head>
<body>
<h1>Pop-up info widget - web components</h1>
<my-paragraph></my-paragraph>
<my-paragraph>
<span slot="my-text">Let's have some different text!</span>
</my-paragraph>
<my-paragraph>
<ul slot="my-text">
<li>Let's have some different text!</li>
<li>In a list!</li>
</ul>
</my-paragraph>
</body>
</html>
<!-- Web Components -->
<template id="my-paragraph">
<p><slot name="my-text">My default text</slot></p>
</template>
<!-- Output HTML -->
<!DOCTYPE html><html><head>
<meta charset="utf-8"/>
<title>Pop-up info box — web components</title>
<script src="main.js" defer=""></script>
</head>
<body>
<h1>Pop-up info widget - web components</h1>
<p>My default text</p>
<p><span>Let&#39;s have some different text!</span></p>
<p><ul>
<li>Let&#39;s have some different text!</li>
<li>In a list!</li>
</ul></p>
</body></html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment