This project amalgamates public-facing Genesys brand icons, Genesys product icons, and general application iconography into a packaged icon library.
See package/README.md
and https://purecloudlabs.github.io/genesys-dev-icon-pack/.
Running the build script first generates the icon pack from the source SVG images found in the icons
folder. This process uses fantasticon to transform the SVG files into a font. Next, the new resources are copied into the packaged component's resources and the package is rebuilt.
Install dependencies and run the build:
cd package
npm ci
npm run build
The resulting icon pack files will be located in the dist
folder. The resulting package source that gets published to npm will be located in the package/lib
folder.
- Ensure the version number has been incremented appropriately in
package/package.json
in the formatx.y.x
using semantic versioning rules - Run the
devengage-publish-npm-package
Jenkins job for this package- Branch builds will have the branch name and build number appended to the package version
The following commands will run the React.js demo application locally and can be accessed at http://localhost:3000/.
cd app
npm ci
npm run start
Mainline builds of the devengage-publish-npm-package
Jenkins job publish the doc site.
- Vector editor: https://www.vectornator.io/
- Canvas 36x36 px
- Draw lines using a 1.6 em stroke and no fill, convert to outline after drawing
- Do not use any strokes in the final exported artwork - fill only!
- Group all elements in one group before exporting (often solves black background in compiled icon)
Try grouping or combining all paths in the document. Sometimes the icon conversion process has trouble identifying boundaries and results in painting unexpected portions or the entire icon the fill color.
If that doesn't fix it, try manually editing the SVG export and remove this element: <clipPath id="ArtboardFrame"> ... </clipPath>
.
The owners of trademarks and registered logos retain ownership of their respective works.
Font Awesome Icons used in this library are attributed to Font Awesome and are licensed under the free license found at https://fontawesome.com/license/free.
GitHub icons used in this library are attributed to GitHub and are used per the guidelines found at https://github.com/logos.
NPM icons used in this library are attributed to NPM and are used per the guidelines found at https://github.com/npm/logos.