| 1 | [Read Me](README.md) |
|
| 2 | [Using the Components](USAGE.md) |
|
| 3 | [<sgnw-components />](SGNW-COMPONENTS.md) |
|
| 4 | [<fsw-components />](FSW-COMPONENTS.md) |
|
| 5 | [Change Log](CHANGELOG.md)
|
| 6 |
|
| 7 | ---
|
| 8 |
|
| 9 | # Using the Sutton SignWriting Web Components
|
| 10 |
|
| 11 | ## Script tag
|
| 12 |
|
| 13 | Put tags similar to this in HEAD
|
| 14 |
|
| 15 | <script type="module" src="https://unpkg.com/@sutton-signwriting/sgnw-components@1.1.0/dist/sgnw-components/sgnw-components.esm.js"></script>
|
| 16 | <link type="text/css" rel="stylesheet" href="https://unpkg.com/@sutton-signwriting/sgnw-components@1.1.0/dist/sgnw-components/sgnw-components.css"/>
|
| 17 |
|
| 18 | Then use the elements anywhere in your template, JSX, html etc
|
| 19 |
|
| 20 | ---
|
| 21 |
|
| 22 | ## ES Modules
|
| 23 |
|
| 24 | Put script tag in HEAD
|
| 25 |
|
| 26 | <script type="module">
|
| 27 | import { defineCustomElements } from 'https://unpkg.com/@sutton-signwriting/sgnw-components@1.1.0/loader/index.es2017.mjs';
|
| 28 | defineCustomElements();
|
| 29 | </script>
|
| 30 |
|
| 31 | Then use the elements anywhere in your template, JSX, html etc
|
| 32 |
|
| 33 | ---
|
| 34 |
|
| 35 | ## Node modules
|
| 36 | - Run `npm install @sutton-signwriting/sgnw-components --save`
|
| 37 | - Put a script tag similar to this `<script src='node_modules/@sutton-signwriting/sgnw-components/dist/sgnw-components.js'></script>` in the head of your index.html
|
| 38 | - Then you can use the element anywhere in your template, JSX, html etc
|
| 39 |
|
| 40 | ---
|
| 41 |
|
| 42 | ## In a stencil-starter app
|
| 43 | - Run `npm install @sutton-signwriting/sgnw-components --save`
|
| 44 | - Add an import to the npm packages `import '@sutton-signwriting/sgnw-components';`
|
| 45 | - Then you can use the element anywhere in your template, JSX, html etc
|
| 46 |
|
| 47 | ---
|
| 48 |
|
| 49 | ## Sutton SignWriting Web Components
|
| 50 |
|
| 51 | **<sgnw-components />** use [SignWriting in Unicode (SWU)](https://tools.ietf.org/id/draft-slevinski-formal-signwriting-09.html#name-signwriting-in-unicode-swu) characters.
|
| 52 |
|
| 53 | - [sgnw-symbol](SGNW-COMPONENTS.md#sgnw-symbol)
|
| 54 | - [sgnw-sign](SGNW-COMPONENTS.md#sgnw-sign)
|
| 55 | - [sgnw-vp](SGNW-COMPONENTS.md#sgnw-vp)
|
| 56 | - [sgnw-button](SGNW-COMPONENTS.md#sgnw-button)
|
| 57 | - [sgnw-palette-symbol](SGNW-COMPONENTS.md#sgnw-palette-symbol)
|
| 58 | - [sgnw-palette](SGNW-COMPONENTS.md#sgnw-palette)
|
| 59 | - [sgnw-signbox](SGNW-COMPONENTS.md#sgnw-signbox)
|
| 60 |
|
| 61 | ---
|
| 62 |
|
| 63 | ## Formal SignWriting Web Components
|
| 64 |
|
| 65 | **<fsw-components />** use [Formal SignWriting in ASCII (FSW)](https://tools.ietf.org/id/draft-slevinski-formal-signwriting-09.html#name-formal-signwriting-in-ascii) characters.
|
| 66 |
|
| 67 | - [fsw-symbol](FSW-COMPONENTS.md#fsw-symbol)
|
| 68 | - [fsw-sign](FSW-COMPONENTS.md#fsw-sign)
|
| 69 | - [fsw-vp](FSW-COMPONENTS.md#fsw-vp)
|
| 70 | - [fsw-button](FSW-COMPONENTS.md#fsw-button)
|
| 71 | - [fsw-palette-symbol](FSW-COMPONENTS.md#fsw-palette-symbol)
|
| 72 | - [fsw-palette](FSW-COMPONENTS.md#fsw-palette)
|
| 73 | - [fsw-signbox](FSW-COMPONENTS.md#fsw-signbox)
|
| 74 |
|
| 75 | ---
|