From d0b86c328d078c20672c18dff6c75a9d1a2906d4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Loi=CC=88c=20Correnson?= <loic.correnson@cea.fr>
Date: Wed, 5 Jan 2022 16:07:24 +0100
Subject: [PATCH] [ivette/doc] included gallery
---
ivette/Makefile | 29 +-
ivette/README.md | 39 +-
ivette/src/dome/doc/guides/icons.md | 447 ++++++++++++++++++++
ivette/src/dome/doc/iconsmd.js | 7 +-
ivette/src/dome/renderer/controls/icons.tsx | 4 +-
ivette/tsconfig.json | 4 +-
6 files changed, 477 insertions(+), 53 deletions(-)
create mode 100644 ivette/src/dome/doc/guides/icons.md
diff --git a/ivette/Makefile b/ivette/Makefile
index 851cbb50b73..4f3a0f25ee7 100644
--- a/ivette/Makefile
+++ b/ivette/Makefile
@@ -107,10 +107,13 @@ api:
# --- Ivette Documentation
# --------------------------------------------------------------------------
+.PHONY: icons
+
VERSION=$(shell echo "console.log(require('./package.json').version)" | node -)
DOC_ICONS_CSS= src/dome/doc/gallery.css
DOC_ICONS_MAKE= src/dome/doc/iconsmd.js
+DOC_ICONS_GALLERY= src/dome/doc/guides/icons.md
DOC_ICONS_DATA= src/dome/renderer/controls/gallery.json
DOC_GUIDES= src/dome/doc/guides
@@ -118,30 +121,20 @@ NODEBIN= ./node_modules/.bin
DOCDIRS= src/ivette src/frama-c src/dome/renderer src/dome/utils
-doc: $(NODEBIN)/typedoc
+icons: $(DOC_ICONS_GALLERY)
+
+$(DOC_ICONS_GALLERY): $(DOC_ICONS_MAKE) $(DOC_ICONS_DATA)
+ @rm -f $@
+ @node $(DOC_ICONS_MAKE) $(DOC_ICONS_DATA) > src/dome/doc/guides/icons.md
+ @chmod a-w $@
+
+doc: $(NODEBIN)/typedoc icons
@echo "\n[Ivette] documentation"
@rm -fr doc/html
@yarn run typedoc $(shell find $(DOCDIRS) -name "*.ts" -or -name "*.tsx")
- @mkdir -p doc/html/guides
- @echo "\n[Ivette] guides"
- @node $(DOC_ICONS_MAKE) $(DOC_ICONS_DATA) > doc/html/guides/icons.md
- @find $(DOC_GUIDES) -name "*.md" -exec cp -f {} doc/html/guides/ \;
- @find doc/html/guides -name "*.md" -print -exec pandoc \
- --standalone --toc --toc-depth=2 --to html \
- --template doc/pandoc/template.html \
- --metadata title="Ivette Documentation" \
- --metadata version="v$(VERSION)" \
- --metadata-file=doc/pandoc/index.json \
- --lua-filter doc/pandoc/href.lua \
- {} -o {}.html \; -delete
@echo "\n[Ivette] main page"
@echo " file://$(PWD)/doc/html/index.html"
-# For searching the doc
-serve: $(NODEBIN)/serve
- @echo "[Ivette] serve doc documentation"
- @yarn run serve doc/html
-
$(NODEBIN)/%:
@echo "[Node] install package $*"
yarn add -D $*
diff --git a/ivette/README.md b/ivette/README.md
index 27e6a2adb06..974baad793a 100644
--- a/ivette/README.md
+++ b/ivette/README.md
@@ -1,29 +1,10 @@
-## Ivette
-
-Main entry points:
-- [frama-c/server](modules/frama_c_server.html) Frama-C Server interaction (low level)
-- [frama-c/states](modules/frama_c_states.html) high-level request management
-
-## Command Line
-
-The following options are recognized by `./bin/frama-c-gui`:
-
-- `--cwd` working directory of Frama-C server
-- `--command` path to Frama-C binary
-- `--socket` ZeroMQ socket address of the server
-
-The default working directory is the current one.
-The default command is the local `bin/frama-c` of source installation.
-The default socket is `ipc:///.frama-c.<pid>.io`.
-
-## Dome Guides
-
-- [Dome Framework](guides/dome.md.html)
-- [Quick Start](guides/quickstart.md.html)
-- [Live Editing](guides/hotreload.md.html)
-- [Application Design](guides/application.md.html)
-- [Application Development](guides/development.md.html)
-- [Styling Components](guides/styling.md.html)
-- [Custom Hooks](guides/hooks.md.html)
-- [Icon Gallery](guides/icons.md.html)
-- [Glossary](guides/glossary.md.html)
+## Dome
+
+- [Dome Framework](src/dome/doc/guides/dome.md)
+- [Quick Start](src/dome/doc/guides/quickstart.md)
+- [Live Editing](src/dome/doc/guides/hotreload.md)
+- [Application Design](src/dome/doc/guides/guides/application.md)
+- [Application Development](src/dome/doc/guides/development.md)
+- [Styling Components](src/dome/doc/guides/styling.md)
+- [Custom Hooks](src/dome/doc/guides/hooks.md)
+- [Glossary](src/dome/doc/guides/glossary.md)
diff --git a/ivette/src/dome/doc/guides/icons.md b/ivette/src/dome/doc/guides/icons.md
new file mode 100644
index 00000000000..f18469224f7
--- /dev/null
+++ b/ivette/src/dome/doc/guides/icons.md
@@ -0,0 +1,447 @@
+
+<hr/>
+
+## Arrows
+
+ <div class="database">
+<div class="icon-block" title="Down">
+<div class="icon-name refname" id="ICON.ANGLE.DOWN">ANGLE.DOWN</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M15.027 5.835l-6.625 6.616q-0.17 0.17-0.402 0.17t-0.402-0.17l-6.625-6.616q-0.17-0.17-0.17-0.406t0.17-0.406l1.482-1.473q0.17-0.17 0.402-0.17t0.402 0.17l4.741 4.741 4.741-4.741q0.17-0.17 0.402-0.17t0.402 0.17l1.482 1.473q0.17 0.17 0.17 0.406t-0.17 0.406z"/>
+</svg>
+</div>
+<div class="icon-block" title="Left">
+<div class="icon-name refname" id="ICON.ANGLE.LEFT">ANGLE.LEFT</div>
+<svg class="icon-svg" viewBox="0 0 11 16">
+<path d="M10.166 3.259l-4.741 4.741 4.741 4.741q0.17 0.17 0.17 0.402t-0.17 0.402l-1.482 1.482q-0.17 0.17-0.402 0.17t-0.402-0.17l-6.625-6.625q-0.17-0.17-0.17-0.402t0.17-0.402l6.625-6.625q0.17-0.17 0.402-0.17t0.402 0.17l1.482 1.482q0.17 0.17 0.17 0.402t-0.17 0.402z"/>
+</svg>
+</div>
+<div class="icon-block" title="Right">
+<div class="icon-name refname" id="ICON.ANGLE.RIGHT">ANGLE.RIGHT</div>
+<svg class="icon-svg" viewBox="0 0 11 16">
+<path d="M10.166 8.402l-6.625 6.625q-0.17 0.17-0.402 0.17t-0.402-0.17l-1.482-1.482q-0.17-0.17-0.17-0.402t0.17-0.402l4.741-4.741-4.741-4.741q-0.17-0.17-0.17-0.402t0.17-0.402l1.482-1.482q0.17-0.17 0.402-0.17t0.402 0.17l6.625 6.625q0.17 0.17 0.17 0.402t-0.17 0.402z"/>
+</svg>
+</div>
+<div class="icon-block" title="Up">
+<div class="icon-name refname" id="ICON.ANGLE.UP">ANGLE.UP</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M15.027 10.978l-1.482 1.473q-0.17 0.17-0.402 0.17t-0.402-0.17l-4.741-4.741-4.741 4.741q-0.17 0.17-0.402 0.17t-0.402-0.17l-1.482-1.473q-0.17-0.17-0.17-0.406t0.17-0.406l6.625-6.616q0.17-0.17 0.402-0.17t0.402 0.17l6.625 6.616q0.17 0.17 0.17 0.406t-0.17 0.406z"/>
+</svg>
+</div>
+<div class="icon-block" title="Expand">
+<div class="icon-name refname" id="ICON.DIR.EXPAND">DIR.EXPAND</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M16 0h-6.5l2.5 2.5-3 3 1.5 1.5 3-3 2.5 2.5z M16 16v-6.5l-2.5 2.5-3-3-1.5 1.5 3 3-2.5 2.5z M0 16h6.5l-2.5-2.5 3-3-1.5-1.5-3 3-2.5-2.5z M0 0v6.5l2.5-2.5 3 3 1.5-1.5-3-3 2.5-2.5z"/>
+</svg>
+</div>
+<div class="icon-block" title="Horizontal">
+<div class="icon-name refname" id="ICON.DIR.HORIZONTAL">DIR.HORIZONTAL</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M16 8q0 0.232-0.17 0.402l-2.286 2.286q-0.17 0.17-0.402 0.17t-0.402-0.17-0.17-0.402v-1.143h-9.143v1.143q0 0.232-0.17 0.402t-0.402 0.17-0.402-0.17l-2.286-2.286q-0.17-0.17-0.17-0.402t0.17-0.402l2.286-2.286q0.17-0.17 0.402-0.17t0.402 0.17 0.17 0.402v1.143h9.143v-1.143q0-0.232 0.17-0.402t0.402-0.17 0.402 0.17l2.286 2.286q0.17 0.17 0.17 0.402z"/>
+</svg>
+</div>
+<div class="icon-block" title="Vertical">
+<div class="icon-name refname" id="ICON.DIR.VERTICAL">DIR.VERTICAL</div>
+<svg class="icon-svg" viewBox="0 0 7 16">
+<path d="M6.287 2.857q0 0.232-0.17 0.402t-0.402 0.17h-1.143v9.143h1.143q0.232 0 0.402 0.17t0.17 0.402-0.17 0.402l-2.286 2.286q-0.17 0.17-0.402 0.17t-0.402-0.17l-2.286-2.286q-0.17-0.17-0.17-0.402t0.17-0.402 0.402-0.17h1.143v-9.143h-1.143q-0.232 0-0.402-0.17t-0.17-0.402 0.17-0.402l2.286-2.286q0.17-0.17 0.402-0.17t0.402 0.17l2.286 2.286q0.17 0.17 0.17 0.402z"/>
+</svg>
+</div>
+<div class="icon-block" title="Down">
+<div class="icon-name refname" id="ICON.TRIANGLE.DOWN">TRIANGLE.DOWN</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M14 3l-6 10-6-10z"/>
+</svg>
+</div>
+<div class="icon-block" title="Left">
+<div class="icon-name refname" id="ICON.TRIANGLE.LEFT">TRIANGLE.LEFT</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M13 2l-10 6 10 6z"/>
+</svg>
+</div>
+<div class="icon-block" title="Right">
+<div class="icon-name refname" id="ICON.TRIANGLE.RIGHT">TRIANGLE.RIGHT</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M3 2l10 6-10 6z"/>
+</svg>
+</div>
+<div class="icon-block" title="Up">
+<div class="icon-name refname" id="ICON.TRIANGLE.UP">TRIANGLE.UP</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M2 13l6-10 6 10z"/>
+</svg>
+</div>
+</div>
+
+<hr/>
+
+## Buttons
+
+ <div class="database">
+<div class="icon-block" title="Check">
+<div class="icon-name refname" id="ICON.CIRC.CHECK">CIRC.CHECK</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M18.91 9.83q0-0.375-0.241-0.616l-1.219-1.205q-0.254-0.254-0.603-0.254t-0.603 0.254l-5.464 5.451-3.027-3.027q-0.254-0.254-0.603-0.254t-0.603 0.254l-1.219 1.205q-0.241 0.241-0.241 0.616 0 0.362 0.241 0.603l4.848 4.848q0.254 0.254 0.603 0.254 0.362 0 0.616-0.254l7.272-7.272q0.241-0.241 0.241-0.603zM22.285 12q0 2.799-1.379 5.163t-3.743 3.743-5.163 1.379-5.163-1.379-3.743-3.743-1.379-5.163 1.379-5.163 3.743-3.743 5.163-1.379 5.163 1.379 3.743 3.743 1.379 5.163z"/>
+</svg>
+</div>
+<div class="icon-block" title="Close">
+<div class="icon-name refname" id="ICON.CIRC.CLOSE">CIRC.CLOSE</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M8.973 17.102q0.348 0 0.603-0.254l2.424-2.424 2.424 2.424q0.254 0.254 0.603 0.254 0.362 0 0.616-0.254l1.205-1.205q0.254-0.254 0.254-0.616 0-0.348-0.254-0.603l-2.424-2.424 2.424-2.424q0.254-0.254 0.254-0.603 0-0.362-0.254-0.616l-1.205-1.205q-0.254-0.254-0.616-0.254-0.348 0-0.603 0.254l-2.424 2.424-2.424-2.424q-0.254-0.254-0.603-0.254-0.362 0-0.616 0.254l-1.205 1.205q-0.254 0.254-0.254 0.616 0 0.348 0.254 0.603l2.424 2.424-2.424 2.424q-0.254 0.254-0.254 0.603 0 0.362 0.254 0.616l1.205 1.205q0.254 0.254 0.616 0.254zM12 22.285q-2.799 0-5.163-1.379t-3.743-3.743-1.379-5.163 1.379-5.163 3.743-3.743 5.163-1.379 5.163 1.379 3.743 3.743 1.379 5.163-1.379 5.163-3.743 3.743-5.163 1.379z"/>
+</svg>
+</div>
+<div class="icon-block" title="Info">
+<div class="icon-name refname" id="ICON.CIRC.INFO">CIRC.INFO</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M15.428 18.429v-2.143q0-0.188-0.121-0.308t-0.308-0.121h-1.286v-6.857q0-0.188-0.121-0.308t-0.308-0.121h-4.286q-0.188 0-0.308 0.121t-0.121 0.308v2.143q0 0.188 0.121 0.308t0.308 0.121h1.286v4.286h-1.286q-0.188 0-0.308 0.121t-0.121 0.308v2.143q0 0.188 0.121 0.308t0.308 0.121h6q0.188 0 0.308-0.121t0.121-0.308zM13.714 6.429v-2.143q0-0.188-0.121-0.308t-0.308-0.121h-2.571q-0.188 0-0.308 0.121t-0.121 0.308v2.143q0 0.188 0.121 0.308t0.308 0.121h2.571q0.188 0 0.308-0.121t0.121-0.308zM22.285 12q0 2.799-1.379 5.163t-3.743 3.743-5.163 1.379-5.163-1.379-3.743-3.743-1.379-5.163 1.379-5.163 3.743-3.743 5.163-1.379 5.163 1.379 3.743 3.743 1.379 5.163z"/>
+</svg>
+</div>
+<div class="icon-block" title="Remove">
+<div class="icon-name refname" id="ICON.CIRC.MINUS">CIRC.MINUS</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M17.999 12.857v-1.714q0-0.348-0.254-0.603t-0.603-0.254h-10.286q-0.348 0-0.603 0.254t-0.254 0.603v1.714q0 0.348 0.254 0.603t0.603 0.254h10.286q0.348 0 0.603-0.254t0.254-0.603zM22.285 12q0 2.799-1.379 5.163t-3.743 3.743-5.163 1.379-5.163-1.379-3.743-3.743-1.379-5.163 1.379-5.163 3.743-3.743 5.163-1.379 5.163 1.379 3.743 3.743 1.379 5.163z"/>
+</svg>
+</div>
+<div class="icon-block" title="Add">
+<div class="icon-name refname" id="ICON.CIRC.PLUS">CIRC.PLUS</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M17.999 12.857v-1.714q0-0.348-0.254-0.603t-0.603-0.254h-3.429v-3.429q0-0.348-0.254-0.603t-0.603-0.254h-1.714q-0.348 0-0.603 0.254t-0.254 0.603v3.429h-3.429q-0.348 0-0.603 0.254t-0.254 0.603v1.714q0 0.348 0.254 0.603t0.603 0.254h3.429v3.429q0 0.348 0.254 0.603t0.603 0.254h1.714q0.348 0 0.603-0.254t0.254-0.603v-3.429h3.429q0.348 0 0.603-0.254t0.254-0.603zM22.285 12q0 2.799-1.379 5.163t-3.743 3.743-5.163 1.379-5.163-1.379-3.743-3.743-1.379-5.163 1.379-5.163 3.743-3.743 5.163-1.379 5.163 1.379 3.743 3.743 1.379 5.163z"/>
+</svg>
+</div>
+<div class="icon-block" title="Check">
+<div class="icon-name refname" id="ICON.CIRC.QUESTION">CIRC.QUESTION</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M13.714 18.429v-2.571q0-0.188-0.121-0.308t-0.308-0.121h-2.571q-0.188 0-0.308 0.121t-0.121 0.308v2.571q0 0.188 0.121 0.308t0.308 0.121h2.571q0.188 0 0.308-0.121t0.121-0.308zM17.142 9.429q0-1.179-0.743-2.183t-1.855-1.554-2.277-0.549q-3.254 0-4.969 2.853-0.201 0.321 0.107 0.563l1.768 1.339q0.094 0.080 0.254 0.080 0.214 0 0.335-0.161 0.71-0.911 1.152-1.232 0.455-0.321 1.152-0.321 0.643 0 1.145 0.348t0.502 0.79q0 0.509-0.268 0.817t-0.911 0.603q-0.844 0.375-1.547 1.158t-0.703 1.681v0.482q0 0.188 0.121 0.308t0.308 0.121h2.571q0.188 0 0.308-0.121t0.121-0.308q0-0.254 0.288-0.663t0.73-0.663q0.429-0.241 0.656-0.382t0.616-0.469 0.596-0.643 0.375-0.81 0.167-1.085zM22.285 12q0 2.799-1.379 5.163t-3.743 3.743-5.163 1.379-5.163-1.379-3.743-3.743-1.379-5.163 1.379-5.163 3.743-3.743 5.163-1.379 5.163 1.379 3.743 3.743 1.379 5.163z"/>
+</svg>
+</div>
+<div class="icon-block" title="Off">
+<div class="icon-name refname" id="ICON.SWITCH.OFF">SWITCH.OFF</div>
+<svg class="icon-svg" viewBox="0 0 32 28">
+<path d="M18 14c0-4.406-3.594-8-8-8s-8 3.594-8 8 3.594 8 8 8 8-3.594 8-8zM30 14c0-4.406-3.594-8-8-8h-6.031c2.438 1.828 4.031 4.734 4.031 8s-1.594 6.172-4.031 8h6.031c4.406 0 8-3.594 8-8zM32 14c0 5.516-4.484 10-10 10h-12c-5.516 0-10-4.484-10-10s4.484-10 10-10h12c5.516 0 10 4.484 10 10z"/>
+</svg>
+</div>
+<div class="icon-block" title="On">
+<div class="icon-name refname" id="ICON.SWITCH.ON">SWITCH.ON</div>
+<svg class="icon-svg" viewBox="0 0 32 28">
+<path d="M0 14c0-5.516 4.484-10 10-10h12c5.516 0 10 4.484 10 10s-4.484 10-10 10h-12c-5.516 0-10-4.484-10-10zM22 22c4.406 0 8-3.594 8-8s-3.594-8-8-8-8 3.594-8 8 3.594 8 8 8z"/>
+</svg>
+</div>
+</div>
+
+<hr/>
+
+## Desktop
+
+ <div class="database">
+<div class="icon-block" title="Display">
+<div class="icon-name refname" id="ICON.DISPLAY">DISPLAY</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M21 15.984v-12h-18v12h18zM21 2.016q0.797 0 1.406 0.586t0.609 1.383v12q0 0.797-0.609 1.406t-1.406 0.609h-6.984v2.016h1.969v1.969h-7.969v-1.969h1.969v-2.016h-6.984q-0.797 0-1.406-0.609t-0.609-1.406v-12q0-0.797 0.609-1.383t1.406-0.586h18z"/>
+</svg>
+</div>
+<div class="icon-block" title="File">
+<div class="icon-name refname" id="ICON.FILE">FILE</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M19.661 5.089q0.375 0.375 0.643 1.018t0.268 1.179v15.429q0 0.536-0.375 0.911t-0.911 0.375h-18q-0.536 0-0.911-0.375t-0.375-0.911v-21.429q0-0.536 0.375-0.911t0.911-0.375h12q0.536 0 1.179 0.268t1.018 0.643zM13.714 1.821v5.036h5.036q-0.134-0.388-0.295-0.549l-4.192-4.192q-0.161-0.161-0.549-0.295zM18.857 22.286v-13.714h-5.571q-0.536 0-0.911-0.375t-0.375-0.911v-5.571h-10.286v20.571h17.143z"/>
+</svg>
+</div>
+<div class="icon-block" title="Folder">
+<div class="icon-name refname" id="ICON.FOLDER">FOLDER</div>
+<svg class="icon-svg" viewBox="0 0 22 24">
+<path d="M20.573 18.428v-9.429q0-0.536-0.375-0.911t-0.911-0.375h-9.429q-0.536 0-0.911-0.375t-0.375-0.911v-0.857q0-0.536-0.375-0.911t-0.911-0.375h-4.286q-0.536 0-0.911 0.375t-0.375 0.911v12.857q0 0.536 0.375 0.911t0.911 0.375h16.286q0.536 0 0.911-0.375t0.375-0.911zM22.287 9v9.429q0 1.232-0.884 2.116t-2.116 0.884h-16.286q-1.232 0-2.116-0.884t-0.884-2.116v-12.857q0-1.232 0.884-2.116t2.116-0.884h4.286q1.232 0 2.116 0.884t0.884 2.116v0.429h9q1.232 0 2.116 0.884t0.884 2.116z"/>
+</svg>
+</div>
+<div class="icon-block" title="Folder (open)">
+<div class="icon-name refname" id="ICON.FOLDER.OPEN">FOLDER.OPEN</div>
+<svg class="icon-svg" viewBox="0 0 26 24">
+<path d="M23.853 12.469q0-0.469-0.71-0.469h-14.571q-0.536 0-1.145 0.288t-0.958 0.703l-3.938 4.862q-0.241 0.321-0.241 0.536 0 0.469 0.71 0.469h14.571q0.536 0 1.152-0.295t0.951-0.71l3.938-4.862q0.241-0.295 0.241-0.522zM8.571 10.286h10.286v-2.143q0-0.536-0.375-0.911t-0.911-0.375h-7.714q-0.536 0-0.911-0.375t-0.375-0.911v-0.857q0-0.536-0.375-0.911t-0.911-0.375h-4.286q-0.536 0-0.911 0.375t-0.375 0.911v11.424l3.429-4.219q0.589-0.71 1.554-1.172t1.875-0.462zM25.567 12.469q0 0.83-0.616 1.607l-3.951 4.862q-0.576 0.71-1.554 1.172t-1.875 0.462h-14.571q-1.232 0-2.116-0.884t-0.884-2.116v-12.857q0-1.232 0.884-2.116t2.116-0.884h4.286q1.232 0 2.116 0.884t0.884 2.116v0.429h7.286q1.232 0 2.116 0.884t0.884 2.116v2.143h2.571q0.723 0 1.326 0.328t0.897 0.944q0.201 0.429 0.201 0.911z"/>
+</svg>
+</div>
+<div class="icon-block" title="Home">
+<div class="icon-name refname" id="ICON.HOME">HOME</div>
+<svg class="icon-svg" viewBox="0 0 22 24">
+<path d="M18.857 13.286v6.429q0 0.348-0.254 0.603t-0.603 0.254h-5.143v-5.143h-3.429v5.143h-5.143q-0.348 0-0.603-0.254t-0.254-0.603v-6.429q0-0.013 0.007-0.040t0.007-0.040l7.701-6.348 7.701 6.348q0.013 0.027 0.013 0.080zM21.844 12.362l-0.83 0.991q-0.107 0.121-0.281 0.147h-0.040q-0.174 0-0.281-0.094l-9.268-7.728-9.268 7.728q-0.161 0.107-0.321 0.094-0.174-0.027-0.281-0.147l-0.83-0.991q-0.107-0.134-0.094-0.315t0.147-0.288l9.629-8.022q0.429-0.348 1.018-0.348t1.018 0.348l3.268 2.732v-2.612q0-0.188 0.121-0.308t0.308-0.121h2.571q0.188 0 0.308 0.121t0.121 0.308v5.464l2.933 2.438q0.134 0.107 0.147 0.288t-0.094 0.315z"/>
+</svg>
+</div>
+<div class="icon-block" title="Items (grid)">
+<div class="icon-name refname" id="ICON.ITEMS.GRID">ITEMS.GRID</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M4.571 11.143v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607zM4.571 6.571v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607zM10.286 11.143v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607zM4.571 2v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607zM10.286 6.571v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607zM16 11.143v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607zM10.286 2v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607zM16 6.571v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607zM16 2v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607z"/>
+</svg>
+</div>
+<div class="icon-block" title="Items (list)">
+<div class="icon-name refname" id="ICON.ITEMS.LIST">ITEMS.LIST</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M4.571 11.143v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607zM4.571 6.571v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607zM16 11.143v1.714q0 0.357-0.25 0.607t-0.607 0.25h-8.571q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h8.571q0.357 0 0.607 0.25t0.25 0.607zM4.571 2v1.714q0 0.357-0.25 0.607t-0.607 0.25h-2.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h2.857q0.357 0 0.607 0.25t0.25 0.607zM16 6.571v1.714q0 0.357-0.25 0.607t-0.607 0.25h-8.571q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h8.571q0.357 0 0.607 0.25t0.25 0.607zM16 2v1.714q0 0.357-0.25 0.607t-0.607 0.25h-8.571q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h8.571q0.357 0 0.607 0.25t0.25 0.607z"/>
+</svg>
+</div>
+<div class="icon-block" title="Sidebar">
+<div class="icon-name refname" id="ICON.SIDEBAR">SIDEBAR</div>
+<svg class="icon-svg" viewBox="0 0 20 20">
+<path d="M7 3h-5v14h5v-14zM9 3v14h9v-14h-9zM0 3c0-1.1 0.9-2 2-2h16c1.105 0 2 0.895 2 2v0 14c0 1.105-0.895 2-2 2v0h-16c-1.105 0-2-0.895-2-2v0-14zM3 4h3v2h-3v-2zM3 7h3v2h-3v-2zM3 10h3v2h-3v-2z"/>
+</svg>
+</div>
+<div class="icon-block" title="Trash">
+<div class="icon-name refname" id="ICON.TRASH">TRASH</div>
+<svg class="icon-svg" viewBox="0 0 19 24">
+<path d="M6.857 9.857v7.714q0 0.188-0.121 0.308t-0.308 0.121h-0.857q-0.188 0-0.308-0.121t-0.121-0.308v-7.714q0-0.188 0.121-0.308t0.308-0.121h0.857q0.188 0 0.308 0.121t0.121 0.308zM10.286 9.857v7.714q0 0.188-0.121 0.308t-0.308 0.121h-0.857q-0.188 0-0.308-0.121t-0.121-0.308v-7.714q0-0.188 0.121-0.308t0.308-0.121h0.857q0.188 0 0.308 0.121t0.121 0.308zM13.714 9.857v7.714q0 0.188-0.121 0.308t-0.308 0.121h-0.857q-0.188 0-0.308-0.121t-0.121-0.308v-7.714q0-0.188 0.121-0.308t0.308-0.121h0.857q0.188 0 0.308 0.121t0.121 0.308zM15.429 19.554v-12.696h-12v12.696q0 0.295 0.094 0.542t0.194 0.362 0.141 0.114h11.143q0.040 0 0.141-0.114t0.194-0.362 0.094-0.542zM6.429 5.143h6l-0.643-1.567q-0.094-0.121-0.228-0.147h-4.246q-0.134 0.027-0.228 0.147zM18.857 5.571v0.857q0 0.188-0.121 0.308t-0.308 0.121h-1.286v12.696q0 1.112-0.629 1.922t-1.513 0.81h-11.143q-0.884 0-1.513-0.783t-0.629-1.895v-12.75h-1.286q-0.188 0-0.308-0.121t-0.121-0.308v-0.857q0-0.188 0.121-0.308t0.308-0.121h4.138l0.938-2.237q0.201-0.496 0.723-0.844t1.058-0.348h4.286q0.536 0 1.058 0.348t0.723 0.844l0.938 2.237h4.138q0.188 0 0.308 0.121t0.121 0.308z"/>
+</svg>
+</div>
+</div>
+
+<hr/>
+
+## Eva
+
+ <div class="database">
+<div class="icon-block" title="DROP.EMPTY">
+<div class="icon-name refname" id="ICON.DROP.EMPTY">DROP.EMPTY</div>
+<svg class="icon-svg" viewBox="0 0 512 512">
+<path d="M353.613,133.606c-39.327-66.81-77.99-121.944-79.618-124.258C269.876,3.487,263.163,0,256.001,0 c-7.163,0-13.875,3.487-17.994,9.347c-1.626,2.314-40.291,57.448-79.618,124.258C103.415,226.999,76.69,292.12,76.69,332.691 C76.69,431.563,157.128,512,256.001,512S435.31,431.563,435.31,332.691C435.31,292.12,408.587,226.997,353.613,133.606z M256.001,468.012c-74.616,0-135.323-60.705-135.323-135.321c0-57.658,85.693-197.636,135.324-271.762 c49.63,74.111,135.32,214.066,135.32,271.762C391.322,407.308,330.617,468.012,256.001,468.012z"/>
+</svg>
+</div>
+<div class="icon-block" title="DROP.FILLED">
+<div class="icon-name refname" id="ICON.DROP.FILLED">DROP.FILLED</div>
+<svg class="icon-svg" viewBox="0 0 295 295">
+<path d="M158.116,6.916c-1.938-4.214-6.151-6.915-10.789-6.916c-4.639-0.001-8.855,2.697-10.793,6.911 c-29.875,64.975-82.858,148.605-82.858,194.09c0,51.721,41.927,93.648,93.648,93.648s93.649-41.928,93.649-93.648 C240.974,155.519,187.992,71.891,158.116,6.916z M143.324,264.816c-34.601,0-62.75-28.149-62.75-62.75c0-6.903,5.597-12.5,12.5-12.5 c6.903,0,12.5,5.597,12.5,12.5c0,20.815,16.935,37.75,37.75,37.75c6.903,0,12.5,5.597,12.5,12.5 C155.824,259.22,150.227,264.816,143.324,264.816z"/>
+</svg>
+</div>
+</div>
+
+<hr/>
+
+## Media
+
+ <div class="database">
+<div class="icon-block" title="MEDIA.EJECT">
+<div class="icon-name refname" id="ICON.MEDIA.EJECT">MEDIA.EJECT</div>
+<svg class="icon-svg" viewBox="0 0 21 24">
+<path d="M0.188 13.112l9.509-9.509q0.254-0.254 0.603-0.254t0.603 0.254l9.509 9.509q0.254 0.254 0.174 0.429t-0.429 0.174h-19.714q-0.348 0-0.429-0.174t0.174-0.429zM19.728 20.571h-18.857q-0.348 0-0.603-0.254t-0.254-0.603v-3.429q0-0.348 0.254-0.603t0.603-0.254h18.857q0.348 0 0.603 0.254t0.254 0.603v3.429q0 0.348-0.254 0.603t-0.603 0.254z"/>
+</svg>
+</div>
+<div class="icon-block" title="Next">
+<div class="icon-name refname" id="ICON.MEDIA.NEXT">MEDIA.NEXT</div>
+<svg class="icon-svg" viewBox="0 0 14 24">
+<path d="M0.603 22.112q-0.254 0.254-0.429 0.174t-0.174-0.429v-19.714q0-0.348 0.174-0.429t0.429 0.174l9.509 9.509q0.107 0.107 0.174 0.254v-9.080q0-0.348 0.254-0.603t0.603-0.254h1.714q0.348 0 0.603 0.254t0.254 0.603v18.857q0 0.348-0.254 0.603t-0.603 0.254h-1.714q-0.348 0-0.603-0.254t-0.254-0.603v-9.080q-0.067 0.134-0.174 0.254z"/>
+</svg>
+</div>
+<div class="icon-block" title="MEDIA.PAUSE">
+<div class="icon-name refname" id="ICON.MEDIA.PAUSE">MEDIA.PAUSE</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M20.571 2.571v18.857q0 0.348-0.254 0.603t-0.603 0.254h-6.857q-0.348 0-0.603-0.254t-0.254-0.603v-18.857q0-0.348 0.254-0.603t0.603-0.254h6.857q0.348 0 0.603 0.254t0.254 0.603zM8.571 2.571v18.857q0 0.348-0.254 0.603t-0.603 0.254h-6.857q-0.348 0-0.603-0.254t-0.254-0.603v-18.857q0-0.348 0.254-0.603t0.603-0.254h6.857q0.348 0 0.603 0.254t0.254 0.603z"/>
+</svg>
+</div>
+<div class="icon-block" title="MEDIA.PLAY">
+<div class="icon-name refname" id="ICON.MEDIA.PLAY">MEDIA.PLAY</div>
+<svg class="icon-svg" viewBox="0 0 19 24">
+<path d="M18.547 12.415l-17.786 9.884q-0.308 0.174-0.529 0.040t-0.221-0.482v-19.714q0-0.348 0.221-0.482t0.529 0.040l17.786 9.884q0.308 0.174 0.308 0.415t-0.308 0.415z"/>
+</svg>
+</div>
+<div class="icon-block" title="Previous">
+<div class="icon-name refname" id="ICON.MEDIA.PREV">MEDIA.PREV</div>
+<svg class="icon-svg" viewBox="0 0 14 24">
+<path d="M13.112 1.888q0.254-0.254 0.429-0.174t0.174 0.429v19.714q0 0.348-0.174 0.429t-0.429-0.174l-9.509-9.509q-0.121-0.121-0.174-0.254v9.080q0 0.348-0.254 0.603t-0.603 0.254h-1.714q-0.348 0-0.603-0.254t-0.254-0.603v-18.857q0-0.348 0.254-0.603t0.603-0.254h1.714q0.348 0 0.603 0.254t0.254 0.603v9.080q0.054-0.147 0.174-0.254z"/>
+</svg>
+</div>
+<div class="icon-block" title="MEDIA.STOP">
+<div class="icon-name refname" id="ICON.MEDIA.STOP">MEDIA.STOP</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M20.571 2.571v18.857q0 0.348-0.254 0.603t-0.603 0.254h-18.857q-0.348 0-0.603-0.254t-0.254-0.603v-18.857q0-0.348 0.254-0.603t0.603-0.254h18.857q0.348 0 0.603 0.254t0.254 0.603z"/>
+</svg>
+</div>
+</div>
+
+<hr/>
+
+## Signs
+
+ <div class="database">
+<div class="icon-block" title="ATTENTION">
+<div class="icon-name refname" id="ICON.ATTENTION">ATTENTION</div>
+<svg class="icon-svg" viewBox="0 0 6 16">
+<path d="M4.574 11.714v2q0 0.232-0.17 0.402t-0.402 0.17h-2.286q-0.232 0-0.402-0.17t-0.17-0.402v-2q0-0.232 0.17-0.402t0.402-0.17h2.286q0.232 0 0.402 0.17t0.17 0.402zM4.841 2.286l-0.25 6.857q-0.009 0.232-0.183 0.402t-0.406 0.17h-2.286q-0.232 0-0.406-0.17t-0.183-0.402l-0.25-6.857q-0.009-0.232 0.156-0.402t0.397-0.17h2.857q0.232 0 0.397 0.17t0.156 0.402z"/>
+</svg>
+</div>
+<div class="icon-block" title="Check">
+<div class="icon-name refname" id="ICON.CHECK">CHECK</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M22.379 7.58q0 0.536-0.375 0.911l-11.518 11.518q-0.375 0.375-0.911 0.375t-0.911-0.375l-6.67-6.67q-0.375-0.375-0.375-0.911t0.375-0.911l1.821-1.821q0.375-0.375 0.911-0.375t0.911 0.375l3.938 3.951 8.786-8.799q0.375-0.375 0.911-0.375t0.911 0.375l1.821 1.821q0.375 0.375 0.375 0.911z"/>
+</svg>
+</div>
+<div class="icon-block" title="Cross">
+<div class="icon-name refname" id="ICON.CROSS">CROSS</div>
+<svg class="icon-svg" viewBox="0 0 19 24">
+<path d="M17.384 17.705q0 0.536-0.375 0.911l-1.821 1.821q-0.375 0.375-0.911 0.375t-0.911-0.375l-3.938-3.938-3.938 3.938q-0.375 0.375-0.911 0.375t-0.911-0.375l-1.821-1.821q-0.375-0.375-0.375-0.911t0.375-0.911l3.938-3.938-3.938-3.938q-0.375-0.375-0.375-0.911t0.375-0.911l1.821-1.821q0.375-0.375 0.911-0.375t0.911 0.375l3.938 3.938 3.938-3.938q0.375-0.375 0.911-0.375t0.911 0.375l1.821 1.821q0.375 0.375 0.375 0.911t-0.375 0.911l-3.938 3.938 3.938 3.938q0.375 0.375 0.375 0.911z"/>
+</svg>
+</div>
+<div class="icon-block" title="Help">
+<div class="icon-name refname" id="ICON.HELP">HELP</div>
+<svg class="icon-svg" viewBox="0 0 9 16">
+<path d="M5.874 11.214v2.143q0 0.143-0.107 0.25t-0.25 0.107h-2.143q-0.143 0-0.25-0.107t-0.107-0.25v-2.143q0-0.143 0.107-0.25t0.25-0.107h2.143q0.143 0 0.25 0.107t0.107 0.25zM8.696 5.857q0 0.482-0.138 0.902t-0.313 0.683-0.491 0.531-0.513 0.388-0.545 0.317q-0.366 0.205-0.612 0.58t-0.246 0.598q0 0.152-0.107 0.29t-0.25 0.138h-2.143q-0.134 0-0.228-0.165t-0.094-0.335v-0.402q0-0.741 0.58-1.397t1.277-0.969q0.527-0.241 0.75-0.5t0.223-0.679q0-0.375-0.415-0.661t-0.96-0.286q-0.58 0-0.964 0.259-0.313 0.223-0.955 1.027-0.116 0.143-0.277 0.143-0.107 0-0.223-0.071l-1.464-1.116q-0.116-0.089-0.138-0.223t0.049-0.25q1.429-2.375 4.143-2.375 0.714 0 1.438 0.277t1.304 0.741 0.946 1.138 0.366 1.415z"/>
+</svg>
+</div>
+<div class="icon-block" title="Information">
+<div class="icon-name refname" id="ICON.INFO">INFO</div>
+<svg class="icon-svg" viewBox="0 0 6 16">
+<path d="M5.717 12.571v1.143q0 0.232-0.17 0.402t-0.402 0.17h-4.571q-0.232 0-0.402-0.17t-0.17-0.402v-1.143q0-0.232 0.17-0.402t0.402-0.17h0.571v-3.429h-0.571q-0.232 0-0.402-0.17t-0.17-0.402v-1.143q0-0.232 0.17-0.402t0.402-0.17h3.429q0.232 0 0.402 0.17t0.17 0.402v5.143h0.571q0.232 0 0.402 0.17t0.17 0.402zM4.574 2.286v1.714q0 0.232-0.17 0.402t-0.402 0.17h-2.286q-0.232 0-0.402-0.17t-0.17-0.402v-1.714q0-0.232 0.17-0.402t0.402-0.17h2.286q0.232 0 0.402 0.17t0.17 0.402z"/>
+</svg>
+</div>
+<div class="icon-block" title="MINUS">
+<div class="icon-name refname" id="ICON.MINUS">MINUS</div>
+<svg class="icon-svg" viewBox="0 0 13 16">
+<path d="M12.575 7.143v1.714q0 0.357-0.25 0.607t-0.607 0.25h-10.857q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h10.857q0.357 0 0.607 0.25t0.25 0.607z"/>
+</svg>
+</div>
+<div class="icon-block" title="PLUS">
+<div class="icon-name refname" id="ICON.PLUS">PLUS</div>
+<svg class="icon-svg" viewBox="0 0 13 16">
+<path d="M12.575 7.143v1.714q0 0.357-0.25 0.607t-0.607 0.25h-3.714v3.714q0 0.357-0.25 0.607t-0.607 0.25h-1.714q-0.357 0-0.607-0.25t-0.25-0.607v-3.714h-3.714q-0.357 0-0.607-0.25t-0.25-0.607v-1.714q0-0.357 0.25-0.607t0.607-0.25h3.714v-3.714q0-0.357 0.25-0.607t0.607-0.25h1.714q0.357 0 0.607 0.25t0.25 0.607v3.714h3.714q0.357 0 0.607 0.25t0.25 0.607z"/>
+</svg>
+</div>
+<div class="icon-block" title="Warning">
+<div class="icon-name refname" id="ICON.WARNING">WARNING</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M13.714 18.415v-2.545q0-0.188-0.127-0.315t-0.301-0.127h-2.571q-0.174 0-0.301 0.127t-0.127 0.315v2.545q0 0.188 0.127 0.315t0.301 0.127h2.571q0.174 0 0.301-0.127t0.127-0.315zM13.688 13.406l0.241-6.147q0-0.161-0.134-0.254-0.174-0.147-0.321-0.147h-2.946q-0.147 0-0.321 0.147-0.134 0.094-0.134 0.281l0.228 6.121q0 0.134 0.134 0.221t0.321 0.087h2.478q0.188 0 0.315-0.087t0.141-0.221zM13.5 0.897l10.286 18.857q0.469 0.844-0.027 1.688-0.228 0.388-0.623 0.616t-0.85 0.228h-20.571q-0.455 0-0.85-0.228t-0.623-0.616q-0.496-0.844-0.027-1.688l10.286-18.857q0.228-0.415 0.629-0.656t0.871-0.241 0.871 0.241 0.629 0.656z"/>
+</svg>
+</div>
+</div>
+
+<hr/>
+
+## Software
+
+ <div class="database">
+<div class="icon-block" title="Component">
+<div class="icon-name refname" id="ICON.COMPONENT">COMPONENT</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M8 14.545l5.714-3.116v-5.679l-5.714 2.080v6.714zM7.429 6.821l6.232-2.268-6.232-2.268-6.232 2.268zM14.857 4.571v6.857q0 0.313-0.161 0.58t-0.438 0.42l-6.286 3.429q-0.25 0.143-0.545 0.143t-0.545-0.143l-6.286-3.429q-0.277-0.152-0.438-0.42t-0.161-0.58v-6.857q0-0.357 0.205-0.652t0.545-0.42l6.286-2.286q0.196-0.071 0.393-0.071t0.393 0.071l6.286 2.286q0.339 0.125 0.545 0.42t0.205 0.652z"/>
+</svg>
+</div>
+<div class="icon-block" title="Package">
+<div class="icon-name refname" id="ICON.PACKAGE">PACKAGE</div>
+<svg class="icon-svg" viewBox="0 0 21 16">
+<path d="M5.714 14.571l3.429-1.714v-2.804l-3.429 1.464v3.054zM5.143 10.518l3.607-1.545-3.607-1.545-3.607 1.545zM14.857 14.571l3.429-1.714v-2.804l-3.429 1.464v3.054zM14.286 10.518l3.607-1.545-3.607-1.545-3.607 1.545zM10.286 7.902l3.429-1.473v-2.375l-3.429 1.464v2.384zM9.714 4.518l3.938-1.688-3.938-1.688-3.938 1.688zM19.429 9.143v3.714q0 0.321-0.17 0.598t-0.464 0.42l-4 2q-0.223 0.125-0.509 0.125t-0.509-0.125l-4-2q-0.045-0.018-0.063-0.036-0.018 0.018-0.063 0.036l-4 2q-0.223 0.125-0.509 0.125t-0.509-0.125l-4-2q-0.295-0.143-0.464-0.42t-0.17-0.598v-3.714q0-0.339 0.192-0.625t0.504-0.429l3.875-1.661v-3.571q0-0.339 0.192-0.625t0.504-0.429l4-1.714q0.205-0.089 0.446-0.089t0.446 0.089l4 1.714q0.313 0.143 0.504 0.429t0.192 0.625v3.571l3.875 1.661q0.321 0.143 0.509 0.429t0.188 0.625z"/>
+</svg>
+</div>
+</div>
+
+<hr/>
+
+## Tools
+
+ <div class="database">
+<div class="icon-block" title="Clipboard">
+<div class="icon-name refname" id="ICON.CLIPBOARD">CLIPBOARD</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M14.5 2h-4.5c0-1.105-0.895-2-2-2s-2 0.895-2 2h-4.5c-0.276 0-0.5 0.224-0.5 0.5v13c0 0.276 0.224 0.5 0.5 0.5h13c0.276 0 0.5-0.224 0.5-0.5v-13c0-0.276-0.224-0.5-0.5-0.5zM8 1c0.552 0 1 0.448 1 1s-0.448 1-1 1c-0.552 0-1-0.448-1-1s0.448-1 1-1zM14 15h-12v-12h2v1.5c0 0.276 0.224 0.5 0.5 0.5h7c0.276 0 0.5-0.224 0.5-0.5v-1.5h2v12z M7 13.414l-3.207-3.707 0.914-0.914 2.293 1.793 4.293-3.793 0.914 0.914z"/>
+</svg>
+</div>
+<div class="icon-block" title="Source Code">
+<div class="icon-name refname" id="ICON.CODE">CODE</div>
+<svg class="icon-svg" viewBox="0 0 26 24">
+<path d="M8.263 18.737l-0.67 0.67q-0.134 0.134-0.308 0.134t-0.308-0.134l-6.241-6.241q-0.134-0.134-0.134-0.308t0.134-0.308l6.241-6.241q0.134-0.134 0.308-0.134t0.308 0.134l0.67 0.67q0.134 0.134 0.134 0.308t-0.134 0.308l-5.263 5.263 5.263 5.263q0.134 0.134 0.134 0.308t-0.134 0.308zM16.179 4.446l-4.996 17.29q-0.054 0.174-0.208 0.261t-0.315 0.033l-0.83-0.228q-0.174-0.054-0.261-0.208t-0.033-0.328l4.996-17.29q0.054-0.174 0.208-0.261t0.315-0.033l0.83 0.228q0.174 0.054 0.261 0.208t0.033 0.328zM24.978 13.165l-6.241 6.241q-0.134 0.134-0.308 0.134t-0.308-0.134l-0.67-0.67q-0.134-0.134-0.134-0.308t0.134-0.308l5.263-5.263-5.263-5.263q-0.134-0.134-0.134-0.308t0.134-0.308l0.67-0.67q0.134-0.134 0.308-0.134t0.308 0.134l6.241 6.241q0.134 0.134 0.134 0.308t-0.134 0.308z"/>
+</svg>
+</div>
+<div class="icon-block" title="Mouse Pointer">
+<div class="icon-name refname" id="ICON.CURSOR">CURSOR</div>
+<svg class="icon-svg" viewBox="0 0 32 32">
+<path d="M16.689 17.655l5.311 12.345-4 2-4.646-12.678-7.354 6.678v-26l20 16-9.311 1.655z"/>
+</svg>
+</div>
+<div class="icon-block" title="Duplicate">
+<div class="icon-name refname" id="ICON.DUPLICATE">DUPLICATE</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M10 4v-4h-7l-3 3v9h6v4h10v-12h-6zM3 1.414v1.586h-1.586l1.586-1.586zM1 11v-7h3v-3h5v3l-3 3v4h-5zM9 5.414v1.586h-1.586l1.586-1.586zM15 15h-8v-7h3v-3h5v10z"/>
+</svg>
+</div>
+<div class="icon-block" title="Edit">
+<div class="icon-name refname" id="ICON.EDIT">EDIT</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M13.5 0c1.381 0 2.5 1.119 2.5 2.5 0 0.563-0.186 1.082-0.5 1.5l-1 1-3.5-3.5 1-1c0.418-0.314 0.937-0.5 1.5-0.5zM1 11.5l-1 4.5 4.5-1 9.25-9.25-3.5-3.5-9.25 9.25zM11.181 5.681l-7 7-0.862-0.862 7-7 0.862 0.862z"/>
+</svg>
+</div>
+<div class="icon-block" title="EXECUTE">
+<div class="icon-name refname" id="ICON.EXECUTE">EXECUTE</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M5.683 11.282l0.645-0.903-0.707-0.707-0.903 0.645c-0.168-0.094-0.347-0.168-0.535-0.222l-0.183-1.095h-1l-0.183 1.095c-0.188 0.053-0.368 0.128-0.535 0.222l-0.903-0.645-0.707 0.707 0.645 0.903c-0.094 0.168-0.168 0.347-0.222 0.535l-1.095 0.183v1l1.095 0.183c0.053 0.188 0.128 0.368 0.222 0.535l-0.645 0.903 0.707 0.707 0.903-0.645c0.168 0.094 0.347 0.168 0.535 0.222l0.183 1.095h1l0.183-1.095c0.188-0.053 0.368-0.128 0.535-0.222l0.903 0.645 0.707-0.707-0.645-0.903c0.094-0.168 0.168-0.347 0.222-0.535l1.095-0.182v-1l-1.095-0.183c-0.053-0.188-0.128-0.368-0.222-0.535zM3.5 13.5c-0.552 0-1-0.448-1-1s0.448-1 1-1 1 0.448 1 1-0.448 1-1 1zM16 6v-1l-1.053-0.191c-0.019-0.126-0.044-0.25-0.074-0.372l0.899-0.58-0.383-0.924-1.046 0.226c-0.066-0.108-0.136-0.213-0.211-0.315l0.609-0.88-0.707-0.707-0.88 0.609c-0.102-0.074-0.207-0.145-0.315-0.211l0.226-1.046-0.924-0.383-0.58 0.899c-0.122-0.030-0.246-0.054-0.372-0.074l-0.191-1.053h-1l-0.191 1.053c-0.126 0.019-0.25 0.044-0.372 0.074l-0.58-0.899-0.924 0.383 0.226 1.046c-0.108 0.066-0.213 0.136-0.315 0.211l-0.88-0.609-0.707 0.707 0.609 0.88c-0.074 0.102-0.145 0.207-0.211 0.315l-1.046-0.226-0.383 0.924 0.899 0.58c-0.030 0.122-0.054 0.246-0.074 0.372l-1.053 0.191v1l1.053 0.191c0.019 0.126 0.044 0.25 0.074 0.372l-0.899 0.58 0.383 0.924 1.046-0.226c0.066 0.108 0.136 0.213 0.211 0.315l-0.609 0.88 0.707 0.707 0.88-0.609c0.102 0.074 0.207 0.145 0.315 0.211l-0.226 1.046 0.924 0.383 0.58-0.899c0.122 0.030 0.246 0.054 0.372 0.074l0.191 1.053h1l0.191-1.053c0.126-0.019 0.25-0.044 0.372-0.074l0.58 0.899 0.924-0.383-0.226-1.046c0.108-0.066 0.213-0.136 0.315-0.211l0.88 0.609 0.707-0.707-0.609-0.88c0.074-0.102 0.145-0.207 0.211-0.315l1.046 0.226 0.383-0.924-0.899-0.58c0.030-0.122 0.054-0.246 0.074-0.372l1.053-0.191zM10.5 7.675c-1.201 0-2.175-0.974-2.175-2.175s0.974-2.175 2.175-2.175 2.175 0.974 2.175 2.175c0 1.201-0.974 2.175-2.175 2.175z"/>
+</svg>
+</div>
+<div class="icon-block" title="Lock">
+<div class="icon-name refname" id="ICON.LOCK">LOCK</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M12.249 6.5h-0.25v-3c0-1.654-1.346-3-3-3h-2c-1.654 0-3 1.346-3 3v3h-0.25c-0.413 0-0.75 0.338-0.75 0.75v7.5c0 0.412 0.337 0.75 0.75 0.75h8.5c0.412 0 0.75-0.338 0.75-0.75v-7.5c0-0.412-0.338-0.75-0.75-0.75zM5.999 3.5c0-0.551 0.449-1 1-1h2c0.551 0 1 0.449 1 1v3h-4v-3z"/>
+</svg>
+</div>
+<div class="icon-block" title="Paint Brush">
+<div class="icon-name refname" id="ICON.PAINTBRUSH">PAINTBRUSH</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M14.42 0q0.625 0 1.094 0.415t0.469 1.040q0 0.563-0.402 1.348-2.964 5.616-4.152 6.714-0.866 0.813-1.946 0.813-1.125 0-1.933-0.826t-0.808-1.96q0-1.143 0.821-1.893l5.696-5.17q0.527-0.482 1.161-0.482zM6.304 9.232q0.348 0.679 0.951 1.161t1.344 0.679l0.009 0.634q0.036 1.902-1.156 3.098t-3.112 1.196q-1.098 0-1.946-0.415t-1.362-1.138-0.772-1.634-0.259-1.964q0.063 0.045 0.366 0.268t0.554 0.397 0.527 0.326 0.411 0.152q0.366 0 0.491-0.33 0.223-0.589 0.513-1.004t0.621-0.679 0.786-0.424 0.92-0.228 1.116-0.094z"/>
+</svg>
+</div>
+<div class="icon-block" title="Push Pin">
+<div class="icon-name refname" id="ICON.PIN">PIN</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M8.5 0l-1.5 1.5 1.5 1.5-3.5 4h-3.5l2.75 2.75-4.25 5.635v0.615h0.615l5.635-4.25 2.75 2.75v-3.5l4-3.5 1.5 1.5 1.5-1.5-7.5-7.5zM7 8.5l-1-1 3.5-3.5 1 1-3.5 3.5z"/>
+</svg>
+</div>
+<div class="icon-block" title="Print">
+<div class="icon-name refname" id="ICON.PRINT">PRINT</div>
+<svg class="icon-svg" viewBox="0 0 22 24">
+<path d="M5.143 20.571h12v-3.429h-12v3.429zM5.143 12h12v-5.143h-2.143q-0.536 0-0.911-0.375t-0.375-0.911v-2.143h-8.571v8.571zM20.571 12.857q0-0.348-0.254-0.603t-0.603-0.254-0.603 0.254-0.254 0.603 0.254 0.603 0.603 0.254 0.603-0.254 0.254-0.603zM22.286 12.857v5.571q0 0.174-0.127 0.301t-0.301 0.127h-3v2.143q0 0.536-0.375 0.911t-0.911 0.375h-12.857q-0.536 0-0.911-0.375t-0.375-0.911v-2.143h-3q-0.174 0-0.301-0.127t-0.127-0.301v-5.571q0-1.058 0.757-1.815t1.815-0.757h0.857v-7.286q0-0.536 0.375-0.911t0.911-0.375h9q0.536 0 1.179 0.268t1.018 0.643l2.036 2.036q0.375 0.375 0.643 1.018t0.268 1.179v3.429h0.857q1.058 0 1.815 0.757t0.757 1.815z"/>
+</svg>
+</div>
+<div class="icon-block" title="Reload">
+<div class="icon-name refname" id="ICON.RELOAD">RELOAD</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M13.901 2.599c-1.463-1.597-3.565-2.599-5.901-2.599-4.418 0-8 3.582-8 8h1.5c0-3.59 2.91-6.5 6.5-6.5 1.922 0 3.649 0.835 4.839 2.161l-2.339 2.339h5.5v-5.5l-2.099 2.099z M14.5 8c0 3.59-2.91 6.5-6.5 6.5-1.922 0-3.649-0.835-4.839-2.161l2.339-2.339h-5.5v5.5l2.099-2.099c1.463 1.597 3.565 2.599 5.901 2.599 4.418 0 8-3.582 8-8h-1.5z"/>
+</svg>
+</div>
+<div class="icon-block" title="Save">
+<div class="icon-name refname" id="ICON.SAVE">SAVE</div>
+<svg class="icon-svg" viewBox="0 0 16 16">
+<path d="M14 0h-14v16h16v-14l-2-2zM8 2h2v4h-2v-4zM14 14h-12v-12h1v5h9v-5h1.172l0.828 0.828v11.172z"/>
+</svg>
+</div>
+<div class="icon-block" title="Search">
+<div class="icon-name refname" id="ICON.SEARCH">SEARCH</div>
+<svg class="icon-svg" viewBox="0 0 22 24">
+<path d="M15.429 11.143q0-2.478-1.761-4.239t-4.239-1.761-4.239 1.761-1.761 4.239 1.761 4.239 4.239 1.761 4.239-1.761 1.761-4.239zM22.286 22.286q0 0.696-0.509 1.205t-1.205 0.509q-0.723 0-1.205-0.509l-4.594-4.58q-2.397 1.661-5.344 1.661-1.915 0-3.663-0.743t-3.013-2.009-2.009-3.013-0.743-3.663 0.743-3.663 2.009-3.013 3.013-2.009 3.663-0.743 3.663 0.743 3.013 2.009 2.009 3.013 0.743 3.663q0 2.946-1.661 5.344l4.594 4.594q0.496 0.496 0.496 1.205z"/>
+</svg>
+</div>
+<div class="icon-block" title="Configure">
+<div class="icon-name refname" id="ICON.SETTINGS">SETTINGS</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M15.428 12q0-1.42-1.004-2.424t-2.424-1.004-2.424 1.004-1.004 2.424 1.004 2.424 2.424 1.004 2.424-1.004 1.004-2.424zM22.285 10.54v2.973q0 0.161-0.107 0.308t-0.268 0.174l-2.478 0.375q-0.254 0.723-0.522 1.219 0.469 0.67 1.433 1.848 0.134 0.161 0.134 0.335t-0.121 0.308q-0.362 0.496-1.326 1.446t-1.259 0.951q-0.161 0-0.348-0.121l-1.848-1.446q-0.589 0.308-1.219 0.509-0.214 1.821-0.388 2.491-0.094 0.375-0.482 0.375h-2.973q-0.188 0-0.328-0.114t-0.154-0.288l-0.375-2.464q-0.656-0.214-1.205-0.496l-1.888 1.433q-0.134 0.121-0.335 0.121-0.188 0-0.335-0.147-1.688-1.527-2.21-2.25-0.094-0.134-0.094-0.308 0-0.161 0.107-0.308 0.201-0.281 0.683-0.891t0.723-0.944q-0.362-0.67-0.549-1.326l-2.451-0.362q-0.174-0.027-0.281-0.167t-0.107-0.315v-2.973q0-0.161 0.107-0.308t0.254-0.174l2.491-0.375q0.188-0.616 0.522-1.232-0.536-0.763-1.433-1.848-0.134-0.161-0.134-0.321 0-0.134 0.121-0.308 0.348-0.482 1.319-1.44t1.266-0.958q0.174 0 0.348 0.134l1.848 1.433q0.589-0.308 1.219-0.509 0.214-1.821 0.388-2.491 0.094-0.375 0.482-0.375h2.973q0.188 0 0.328 0.114t0.154 0.288l0.375 2.464q0.656 0.214 1.205 0.496l1.902-1.433q0.121-0.121 0.321-0.121 0.174 0 0.335 0.134 1.728 1.594 2.21 2.277 0.094 0.107 0.094 0.295 0 0.161-0.107 0.308-0.201 0.281-0.683 0.891t-0.723 0.944q0.348 0.67 0.549 1.313l2.451 0.375q0.174 0.027 0.281 0.167t0.107 0.315z"/>
+</svg>
+</div>
+<div class="icon-block" title="Terminal">
+<div class="icon-name refname" id="ICON.TERMINAL">TERMINAL</div>
+<svg class="icon-svg" viewBox="0 0 15 16">
+<path d="M5.223 8.777l-4.161 4.161q-0.089 0.089-0.205 0.089t-0.205-0.089l-0.446-0.446q-0.089-0.089-0.089-0.205t0.089-0.205l3.509-3.509-3.509-3.509q-0.089-0.089-0.089-0.205t0.089-0.205l0.446-0.446q0.089-0.089 0.205-0.089t0.205 0.089l4.161 4.161q0.089 0.089 0.089 0.205t-0.089 0.205zM14.857 12.857v0.571q0 0.125-0.080 0.205t-0.205 0.080h-8.571q-0.125 0-0.205-0.080t-0.080-0.205v-0.571q0-0.125 0.080-0.205t0.205-0.080h8.571q0.125 0 0.205 0.080t0.080 0.205z"/>
+</svg>
+</div>
+<div class="icon-block" title="Tunings">
+<div class="icon-name refname" id="ICON.TUNINGS">TUNINGS</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M4.714 18.857v1.714h-4.714v-1.714h4.714zM9.429 17.143q0.348 0 0.603 0.254t0.254 0.603v3.429q0 0.348-0.254 0.603t-0.603 0.254h-3.429q-0.348 0-0.603-0.254t-0.254-0.603v-3.429q0-0.348 0.254-0.603t0.603-0.254h3.429zM11.571 12v1.714h-11.571v-1.714h11.571zM3 5.143v1.714h-3v-1.714h3zM20.571 18.857v1.714h-9.857v-1.714h9.857zM7.714 3.429q0.348 0 0.603 0.254t0.254 0.603v3.429q0 0.348-0.254 0.603t-0.603 0.254h-3.429q-0.348 0-0.603-0.254t-0.254-0.603v-3.429q0-0.348 0.254-0.603t0.603-0.254h3.429zM16.286 10.286q0.348 0 0.603 0.254t0.254 0.603v3.429q0 0.348-0.254 0.603t-0.603 0.254h-3.429q-0.348 0-0.603-0.254t-0.254-0.603v-3.429q0-0.348 0.254-0.603t0.603-0.254h3.429zM20.571 12v1.714h-3v-1.714h3zM20.571 5.143v1.714h-11.571v-1.714h11.571z"/>
+</svg>
+</div>
+<div class="icon-block" title="Wrap Text">
+<div class="icon-name refname" id="ICON.WRAPTEXT">WRAPTEXT</div>
+<svg class="icon-svg" viewBox="0 0 24 24">
+<path d="M5 7h14c.55 0 1-.45 1-1s-.45-1-1-1H5c-.55 0-1 .45-1 1s.45 1 1 1zm11.83 4H5c-.55 0-1 .45-1 1s.45 1 1 1h12.13c1 0 1.93.67 2.09 1.66.21 1.25-.76 2.34-1.97 2.34H15v-.79c0-.45-.54-.67-.85-.35l-1.79 1.79c-.2.2-.2.51 0 .71l1.79 1.79c.32.32.85.09.85-.35V19h2c2.34 0 4.21-2.01 3.98-4.39-.2-2.08-2.06-3.61-4.15-3.61zM9 17H5c-.55 0-1 .45-1 1s.45 1 1 1h4c.55 0 1-.45 1-1s-.45-1-1-1z"/>
+</svg>
+</div>
+<div class="icon-block" title="Zoom In">
+<div class="icon-name refname" id="ICON.ZOOM.IN">ZOOM.IN</div>
+<svg class="icon-svg" viewBox="0 0 15 16">
+<path d="M9.143 7.143v0.571q0 0.116-0.085 0.201t-0.201 0.085h-2v2q0 0.116-0.085 0.201t-0.201 0.085h-0.571q-0.116 0-0.201-0.085t-0.085-0.201v-2h-2q-0.116 0-0.201-0.085t-0.085-0.201v-0.571q0-0.116 0.085-0.201t0.201-0.085h2v-2q0-0.116 0.085-0.201t0.201-0.085h0.571q0.116 0 0.201 0.085t0.085 0.201v2h2q0.116 0 0.201 0.085t0.085 0.201zM10.286 7.429q0-1.652-1.174-2.826t-2.826-1.174-2.826 1.174-1.174 2.826 1.174 2.826 2.826 1.174 2.826-1.174 1.174-2.826zM14.857 14.857q0 0.473-0.335 0.808t-0.808 0.335q-0.482 0-0.804-0.339l-3.063-3.054q-1.598 1.107-3.563 1.107-1.277 0-2.442-0.496t-2.009-1.339-1.339-2.009-0.496-2.442 0.496-2.442 1.339-2.009 2.009-1.339 2.442-0.496 2.442 0.496 2.009 1.339 1.339 2.009 0.496 2.442q0 1.964-1.107 3.563l3.063 3.063q0.33 0.33 0.33 0.804z"/>
+</svg>
+</div>
+<div class="icon-block" title="Zoom Out">
+<div class="icon-name refname" id="ICON.ZOOM.OUT">ZOOM.OUT</div>
+<svg class="icon-svg" viewBox="0 0 15 16">
+<path d="M9.143 7.143v0.571q0 0.116-0.085 0.201t-0.201 0.085h-5.143q-0.116 0-0.201-0.085t-0.085-0.201v-0.571q0-0.116 0.085-0.201t0.201-0.085h5.143q0.116 0 0.201 0.085t0.085 0.201zM10.286 7.429q0-1.652-1.174-2.826t-2.826-1.174-2.826 1.174-1.174 2.826 1.174 2.826 2.826 1.174 2.826-1.174 1.174-2.826zM14.857 14.857q0 0.473-0.335 0.808t-0.808 0.335q-0.482 0-0.804-0.339l-3.063-3.054q-1.598 1.107-3.563 1.107-1.277 0-2.442-0.496t-2.009-1.339-1.339-2.009-0.496-2.442 0.496-2.442 1.339-2.009 2.009-1.339 2.442-0.496 2.442 0.496 2.009 1.339 1.339 2.009 0.496 2.442q0 1.964-1.107 3.563l3.063 3.063q0.33 0.33 0.33 0.804z"/>
+</svg>
+</div>
+</div>
+
diff --git a/ivette/src/dome/doc/iconsmd.js b/ivette/src/dome/doc/iconsmd.js
index 74cdbec61c0..f8e4dfe7272 100644
--- a/ivette/src/dome/doc/iconsmd.js
+++ b/ivette/src/dome/doc/iconsmd.js
@@ -21,16 +21,15 @@ for ( var name in icons ) {
index.sort();
if (sections["Others"]) index.push("Others");
-console.log( '---' );
-console.log( 'subtitle: Icons Gallery' );
-console.log( '---' );
console.log();
// --- Gallery (per section) -----------------------------------------
for ( var s = 0 ; s < index.length ; s++ ) {
const section = index[s] ;
- console.log( `## ${section} {#SECTION.${section}}` );
+ console.log( '<hr/>' );
+ console.log();
+ console.log( `## ${section}` );
console.log();
console.log( ` <div class="database">` );
diff --git a/ivette/src/dome/renderer/controls/icons.tsx b/ivette/src/dome/renderer/controls/icons.tsx
index 14017179215..aa336cb6d4c 100644
--- a/ivette/src/dome/renderer/controls/icons.tsx
+++ b/ivette/src/dome/renderer/controls/icons.tsx
@@ -25,9 +25,11 @@
// --------------------------------------------------------------------------
/**
- Consult the [Icon Gallery](../guides/icons.md.html) for default icons.
You can [register](#.register) new icons or override existing ones
and [iterate](#.forEach) over the icon base.
+
+ [[include:icons.md]]
+
@packageDocumentation
@module dome/controls/icons
*/
diff --git a/ivette/tsconfig.json b/ivette/tsconfig.json
index e8699048f19..e276642778a 100644
--- a/ivette/tsconfig.json
+++ b/ivette/tsconfig.json
@@ -99,6 +99,8 @@
"categoryOrder": [ "Hooks", "Components", "*", "Other" ],
"listInvalidSymbolLinks":true,
"hideGenerator":true,
- "readme": "./README.md",
+ "includes": "src/dome/doc/guides",
+ "customCss": "src/dome/doc/gallery.css",
+ "readme": "none"
}
}
--
GitLab