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 | ---
|