Skip to content

Commit

Permalink
Merge branch 'v3' into PMM-7-update-package-manager
Browse files Browse the repository at this point in the history
  • Loading branch information
BupycHuk authored Feb 11, 2025
2 parents 60b25f6 + 95afe77 commit aacb5f4
Show file tree
Hide file tree
Showing 33 changed files with 329 additions and 165 deletions.
119 changes: 66 additions & 53 deletions cli-tests/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 3 additions & 3 deletions cli-tests/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,9 @@
"devDependencies": {
"@types/promise-retry": "^1.1.3",
"@types/shelljs": "^0.8.12",
"@typescript-eslint/eslint-plugin": "^8.23.0",
"@typescript-eslint/parser": "^8.23.0",
"eslint": "9.19",
"@typescript-eslint/eslint-plugin": "^8.24.0",
"@typescript-eslint/parser": "^8.24.0",
"eslint": "9.20",
"eslint-config-airbnb-base": "^15.0.0",
"eslint-config-airbnb-typescript": "^18.0.0",
"eslint-plugin-import": "^2.31.0",
Expand Down
24 changes: 10 additions & 14 deletions documentation/WRITERS-NOTES.md
Original file line number Diff line number Diff line change
Expand Up @@ -133,14 +133,16 @@ Currently, we use three different sets of icons:

The preference should be given to Mkdocs Material icons, since they were initially designed for `mkdocs` project and work very well with it. In rare cases, when an icon cannot be found in Mkdocs Material, you can find a suitable one on Iconscout. FontAwesome icons do not play well with Mkdocs, so use them with caution and don't forget to apply additional CSS styles in case they don't render well in PDF.

Ideally, we should migrate to using just the two first sets.
Ideally, we should migrate to using just the first set, which offers 10,000+ icons, that are more than sufficient for all our documentation needs.

Use HTML for icons:

- For Material Theme Icons (`:` prefix and suffix), go to <https://squidfunk.github.io/mkdocs-material/reference/icons-emojis/>, find an icon, select it and copy the code here.
- For PMM UI (Grafana) icons (`uil-` prefix), go to <https://iconscout.com/unicons/explore/line>, find an icon, select 'Font' and copy the code here.
- For Font Awesome (`fa-` prefix), go to <https://fontawesome.com/icons>, find an icon, copy the code.

Note: the following list is WIP and will be updated as we go along.

| Unicons icon code | Description | Used where |
| -------------------------------------------- | ---------------------------------- | ------------------------------------ |
| <i class="uil uil-angle-down"></i> | Down chevron | PMM UI |
Expand All @@ -151,7 +153,13 @@ Use HTML for icons:
| <i class="uil uil-bolt"></i> | Lightening flash/bolt | PMM UI - Nodes compare |
| <i class="uil uil-caret-right"></i> | Right caret | General |
| <i class="uil uil-clock-nine"></i> | Clock (at nine) | PMM UI - Time range selector |
| <i class="uil uil-cog"></i> | Cog wheel | PMM UI Configuration |
| :material-cog: | Cog wheel | PMM UI Configuration |
| :material-cog-outline: | Cog wheel | PMM UI Configuration->Settings |
| :material-clipboard-list-outline: | Clipboard list | PMM UI - Inventory |
| :material-dots-horizontal: | Triple dots, aligned horizontally | PMM UI - Backup in progress |
| :material-magnify-expand: | Advisors | PMM UI - Advisors |
| :material-view-dashboard: | Abstract blocks assembly | PMM UI - Dashboards |
| :material-dots-circle: | A circle surrounded by smaller ones| PMM UI - Node dashboards |
| <i class="uil uil-comment-alt-share"></i> | Share comment symbol | PMM UI - Share dashboard image |
| <i class="uil uil-compass"></i> | Compass | PMM UI - Explore |
| <i class="uil uil-copy"></i> | Copy | PMM UI - Copy (e.g. backup schedule) |
Expand All @@ -171,7 +179,6 @@ Use HTML for icons:
| <i class="uil uil-question-circle"></i> | Question mark in circle | PMM UI - Help |
| <i class="uil uil-search-minus"></i> | Minus in magnifying glass | PMM UI - Time range zoom out |
| <i class="uil uil-search"></i> | Magnifying glass | PMM UI - Search |
| <i class="uil uil-setting"></i> | Cog wheel | PMM UI Configuration->Settings |
| <i class="uil uil-share-alt"></i> | Share symbol | PMM UI - Share dashboard |
| <i class="uil uil-shield"></i> | Shield | PMM UI - Server admin |
| <i class="uil uil-star"></i> | Star | PMM UI - Dashboard favourites |
Expand All @@ -183,17 +190,6 @@ Use HTML for icons:
| <i class="uil uil-toggle-on"></i> | Toggle (on) | PMM UI - Toggle switch |
| <i class="uil uil-trash-alt"></i> | Trash can | PMM UI - Various 'Delete' operation |

Custom (in-house design) icons are defined as SVG code in `variables.yml`.

| Usage | Description | Used where |
| ---------------------- | ------------------------------------ | -------------------------------- |
| `{{icon.addinstance}}` | Thin + in circle | PMM Add Instance |
| `{{icon.checks}}` | Checkbox list items | Inventory list |
| `{{icon.inventory}}` | Checkbox list items | PMM Inventory & Inventory List |
| `{{icon.dashboards}}` | Abstract blocks assembly | PMM Dashboards |
| `{{icon.node}}` | Circle surrounded by smaller circles | Node dashboards |
| `{{icon.percona}}` | Percona logo | Wherever PMM home icon is needed |

## Symbols

While MkDocs will automatically replace certain strings with symbols, it's preferable where possible to use unicode symbols for other icons, so that they appear when the raw Markdown is exported as HTML and imported into Google Docs.
Expand Down
Loading

0 comments on commit aacb5f4

Please sign in to comment.