@openremote/or-icon 1.8.0-snapshot.20250725120000 → 1.8.0-snapshot.20250725123024

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,61 +1,61 @@
1
- # @openremote/or-icon \<or-icon\>
2
- [![NPM Version][npm-image]][npm-url]
3
- [![Linux Build][travis-image]][travis-url]
4
- [![Test Coverage][coveralls-image]][coveralls-url]
5
-
6
- Web Component for displaying an icon from a loaded iconset.
7
-
8
- ## Install
9
- ```bash
10
- npm i @openremote/or-icon
11
- yarn add @openremote/or-icon
12
- ```
13
-
14
- ## Usage
15
- For a full list of properties, methods and options refer to the TypeDoc generated [documentation]().
16
-
17
- Icons are defined in iconsets, there are two iconsets provided by default and new ones can be created as required (see
18
- [demo-core](../../demo/demo-core)), The `mdi` iconset is quite large and it is possible to prevent loading of this
19
- when initialising the OpenRemote `Manager` via the `ManagerConfig`:
20
-
21
- * `mdi` - [Material Design Icons](https://materialdesignicons.com/)
22
- * `or` - OpenRemote icons (see [here](./or-iconset.ts))
23
-
24
- The default iconset is `mdi` but this can be changed by setting `OrIcon.DEFAULT_ICONSET`, to load an icon use the
25
- following HTML:
26
-
27
- ```$html
28
- <or-icon icon="mdi:access-point" />
29
- ```
30
-
31
- If using the default iconset then the iconset prefix can be omitted:
32
- ```$html
33
- <or-icon icon="access-point" />
34
- ```
35
-
36
- Styling is done through CSS, the following CSS variables can be used:
37
-
38
- ```$css
39
- --or-icon-fill (default: currentcolor)
40
- --or-icon-stroke (default: none)
41
- --or-icon-height (default: 24px)
42
- --or-icon-width (default: 24px)
43
- --or-icon-pointer-events (default: none)
44
- ```
45
-
46
- When an iconset is added then any `or-icon` components in the DOM will be notified and refresh as required.
47
-
48
- ## Supported Browsers
49
- The last 2 versions of all modern browsers are supported, including Chrome, Safari, Opera, Firefox, Edge. In addition,
50
- Internet Explorer 11 is also supported.
51
-
52
-
53
- ## License
54
- [GNU AGPL](https://www.gnu.org/licenses/agpl-3.0.en.html)
55
-
56
- [npm-image]: https://img.shields.io/npm/v/live-xxx.svg
57
- [npm-url]: https://npmjs.org/package/@openremote/or-icon
58
- [travis-image]: https://img.shields.io/travis/live-js/live-xxx/master.svg
59
- [travis-url]: https://travis-ci.org/live-js/live-xxx
60
- [coveralls-image]: https://img.shields.io/coveralls/live-js/live-xxx/master.svg
61
- [coveralls-url]: https://coveralls.io/r/live-js/live-xxx?branch=master
1
+ # @openremote/or-icon \<or-icon\>
2
+ [![NPM Version][npm-image]][npm-url]
3
+ [![Linux Build][travis-image]][travis-url]
4
+ [![Test Coverage][coveralls-image]][coveralls-url]
5
+
6
+ Web Component for displaying an icon from a loaded iconset.
7
+
8
+ ## Install
9
+ ```bash
10
+ npm i @openremote/or-icon
11
+ yarn add @openremote/or-icon
12
+ ```
13
+
14
+ ## Usage
15
+ For a full list of properties, methods and options refer to the TypeDoc generated [documentation]().
16
+
17
+ Icons are defined in iconsets, there are two iconsets provided by default and new ones can be created as required (see
18
+ [demo-core](../../demo/demo-core)), The `mdi` iconset is quite large and it is possible to prevent loading of this
19
+ when initialising the OpenRemote `Manager` via the `ManagerConfig`:
20
+
21
+ * `mdi` - [Material Design Icons](https://materialdesignicons.com/)
22
+ * `or` - OpenRemote icons (see [here](./or-iconset.ts))
23
+
24
+ The default iconset is `mdi` but this can be changed by setting `OrIcon.DEFAULT_ICONSET`, to load an icon use the
25
+ following HTML:
26
+
27
+ ```$html
28
+ <or-icon icon="mdi:access-point" />
29
+ ```
30
+
31
+ If using the default iconset then the iconset prefix can be omitted:
32
+ ```$html
33
+ <or-icon icon="access-point" />
34
+ ```
35
+
36
+ Styling is done through CSS, the following CSS variables can be used:
37
+
38
+ ```$css
39
+ --or-icon-fill (default: currentcolor)
40
+ --or-icon-stroke (default: none)
41
+ --or-icon-height (default: 24px)
42
+ --or-icon-width (default: 24px)
43
+ --or-icon-pointer-events (default: none)
44
+ ```
45
+
46
+ When an iconset is added then any `or-icon` components in the DOM will be notified and refresh as required.
47
+
48
+ ## Supported Browsers
49
+ The last 2 versions of all modern browsers are supported, including Chrome, Safari, Opera, Firefox, Edge. In addition,
50
+ Internet Explorer 11 is also supported.
51
+
52
+
53
+ ## License
54
+ [GNU AGPL](https://www.gnu.org/licenses/agpl-3.0.en.html)
55
+
56
+ [npm-image]: https://img.shields.io/npm/v/live-xxx.svg
57
+ [npm-url]: https://npmjs.org/package/@openremote/or-icon
58
+ [travis-image]: https://img.shields.io/travis/live-js/live-xxx/master.svg
59
+ [travis-url]: https://travis-ci.org/live-js/live-xxx
60
+ [coveralls-image]: https://img.shields.io/coveralls/live-js/live-xxx/master.svg
61
+ [coveralls-url]: https://coveralls.io/r/live-js/live-xxx?branch=master