I played around a bit with it, nice icon library. The icon solution is a bit different that other icons I have worked with (png file icons or icon fonts) so works a bit differently and I got it working by doing the following:
- Add Lucide CDN to startup.html (in the top section under the head tag):
<script src="https://unpkg.com/lucide@latest"></script>
- Add the icons you want throughout your app in the following format:
<i icon-name='menu' class='lucideicon'></i>
- Add Lucide icon generation script to startup.html (end of html file so e.g just before </body> tag):
<script>
$( document ).ready(function() {
lucide.createIcons();
});
</script>
- Create CSS class to style icons, position and change icon size etc.:
.lucideicon {height:12px;}
Another thing worth mentioning is this. These icons are loaded when a JS function is executed (step 3 above) which means this function also needs to run every time you open up something new that has one of these icons e.g a form, query, layout etc..
NB: I spent 5 min on this so there may be other ways to implement this that work better e.g use icon fonts etc.. Using this icon set as icon fonts would arguably be better but I think I read something about them not recommending developers to go that route for whatever reason.