Icon-Shelf / icon-shelf

SVG icon manager for developers.
https://icon-shelf.github.io
MIT License
284 stars 27 forks source link

Unable to view Font Awesome Icons #156

Open wildernessfamily opened 2 months ago

wildernessfamily commented 2 months ago

Describe the bug I downloaded the latest Font Awesome (Free Edition) icon set from the Font Awesome website. I created a local folder on my MacBookPro and then dragged and dropped the SVG icons into Icon Shelf. I also tried creating a folder, copying the SVG's into the folder, then adding a collection in Icon Shelf. Each time, the icons do not show. Just a white box. If I change the color, the box turns that particular color. No icon is displayed. I added icons from Envato, and they display with no problems. I have one Collection from Envato that has over 1000 icons that I added all at once. I thought maybe it was a performance issued with adding that many icons all at once, but there was no problem with the Envato icons.

I thought maybe it was a problem with the SVG. Font awesome does not have width & height defined whereas Envato Icons do. I added both the width="512" and height="512" but that didn't work either. Font Awesome Icon

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc. --><path d="M320 96V416C341.011 416 361.818 411.861 381.23 403.821C400.641 395.78 418.28 383.995 433.138 369.138C447.995 354.28 459.78 336.641 467.821 317.23C475.861 297.818 480 277.011 480 256C480 234.989 475.861 214.182 467.821 194.771C459.78 175.359 447.995 157.72 433.138 142.863C418.28 128.005 400.641 116.22 381.23 108.179C361.818 100.139 341.011 96 320 96ZM0 256L160.002 416L320.003 256L160.002 96L0 256ZM480 256C480 277.011 484.138 297.818 492.179 317.23C500.219 336.643 512.005 354.28 526.862 369.138C541.72 383.995 559.357 395.781 578.77 403.821C598.182 411.862 618.989 416 640 416V96C597.565 96 556.869 112.858 526.862 142.863C496.857 172.869 480 213.565 480 256Z"/></svg>

Envato Icon

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" width="512" height="512" viewBox="0 0 512 512" xml:space="preserve"><switch><g fill="currentColor"><path d="M256 0C114.614 0 0 114.619 0 256c0 141.383 114.614 256 256 256 141.385 0 256-114.617 256-256C512 114.619 397.385 0 256 0zm0 496C123.451 496 16 388.545 16 256S123.451 16 256 16s240 107.455 240 240-107.451 240-240 240z"/><path d="M398.09 126.225c-10.369-10.426-24.039-13.574-38.502-8.871-6.822 2.225-15.146 9.926-18.364 22.115-2.944 11.154-2.349 28.947 17.204 50.381 28.509 31.25 19.465 76.756 19.373 77.195-.016.072-.029.145-.043.215l-21.771 59.645-57.961-166.496h20.512a8 8 0 0 0 0-16H218.406a8 8 0 0 0 0 16h13.623L263.663 249a7.912 7.912 0 0 0-.962 1.836l-27.66 75.98-57.933-166.408h20.511c4.42 0 8-3.582 8-8s-3.58-8-8-8H97.49a8 8 0 0 0 0 16h13.621l84.471 236.562a7.999 7.999 0 0 0 7.534 5.309h15.878a8.002 8.002 0 0 0 7.518-5.264l15.862-43.572.001-.004 29.574-81.234 44.55 124.766a8 8 0 0 0 7.534 5.309h15.877a8.006 8.006 0 0 0 7.516-5.258l60.418-165.52a6.7 6.7 0 0 0 .078-.227c14.152-42.691 10.201-84.908-9.832-105.05zM213.393 386.279h-4.639l-80.652-225.871h32.065l66.214 190.195-12.988 35.676zm120.921 0h-4.643l-80.654-225.871h32.066l66.232 190.25-13.001 35.621zm58.713-160.929c-3.006-15.09-9.535-31.764-22.779-46.281-14.697-16.113-15.483-28.207-13.555-35.516 1.857-7.035 6.407-10.516 7.851-10.984 2.731-.891 5.343-1.334 7.831-1.334 5.404 0 10.218 2.096 14.371 6.271 13.099 13.172 19.397 47.504 6.281 87.844z"/></g></switch></svg>

To Reproduce Steps to reproduce the behavior:

  1. Download the latest Font Awesome (Free Edition) icon pack from the Font Awesome website.
  2. Unzip Icons
  3. Create a Collection for the Icons.
  4. Drag and Drop OR place the icons in the collection folder.

Expected behavior Font Awesome Icons display properly.

Screenshots

Screen Shot 2024-06-28 at 11 49 12 Screen Shot 2024-06-28 at 11 51 32 Screen Shot 2024-06-28 at 11 52 15 Screen Shot 2024-06-28 at 11 53 21 Screen Shot 2024-06-28 at 11 53 43

Additional context Thank you to the developers, and all who gave their time to create this free product. It's awesome and greatly appreciated!