notclickable-jordan / starbase-80

A nice Docker homepage
MIT License
238 stars 12 forks source link

mdi-icons not loading #22

Closed bjschafer closed 8 months ago

bjschafer commented 8 months ago

Howdy! First off, thanks for building this -- it's been awesome!

Summary

When I set this up a few months back, I used some mdi-icons. Recently though, I noticed that they're not loading:

image

The Dashboard icons that I use work fine, so it seems to be specific to mdi-icons.

Details

If I inspect the generated HTML, I think the problem might be with the style on the outer div not being created properly and instead being [object Object] -- but I'm not much of a web dev, so that could be a red herring :)

<div class="block overflow-hidden bg-contain w-16 h-16 rounded-2xl border border-black/5 shadow-sm bg-slate-200 dark:bg-gray-900" style="[object Object]">
  <a href="https://spoolman.example.com" target="_blank" rel="noreffer" title="Spoolman" class="self-center">
    <div classname="block" w-16="" h-16="" bg-black="" dark:bg-white="" overflow-hidden="" style="mask: url(https://cdn.jsdelivr.net/npm/@mdi/svg@latest/svg/library-shelves.svg) no-repeat center / contain;webkit-mask: url(https://cdn.jsdelivr.net/npm/@mdi/svg@latest/svg/library-shelves.svg) no-repeat center / contain">
    </div>
  </a>
<!--snip-->
</div>

Here's a reproducible example of my (sanitized) config:

[
  {
    "category": "Printers",
    "services": [
      {
        "name": "Spoolman",
        "uri": "https://spoolman.example.com",
        "icon": "mdi-library-shelves",
        "description": "Filament manager"
      },
      {
        "name": "Trident",
        "uri": "https://trident.example.com",
        "icon": "mdi-triforce",
        "description": "VT350"
      },
      {
        "name": "Prusa Mini",
        "uri": "https://prusamini.example.com",
        "icon": "fluidd"
      },
      {
        "name": "Ender Tres",
        "uri": "https://endertres.example.com",
        "icon": "mdi-blender",
        "description": "Ender 3"
      },
      {
        "name": "Veronica",
        "uri": "http://veronica.example.com",
        "icon": "voron",
        "description": "V0.2",
        "iconBubble": false
      },
      {
        "name": "Voron V2",
        "uri": "http://voronv2.example.com",
        "icon": "voron",
        "description": "V2.4",
        "iconBubble": false
      },
      {
        "name": "Replicator",
        "uri": "http://replicator.example.com:8000",
        "icon": "mdi-bolt",
        "description": "CNC machine"
      }
    ]
  }
]
notclickable-jordan commented 8 months ago

On it. My conversion to totally flat Node modules probably broke this. Sorry. Will fix it ASAP.

notclickable-jordan commented 8 months ago

Fixed in v1.4.3

https://github.com/notclickable-jordan/starbase-80/commit/a71c9f3e9564b553fd3c151aa0fa909f4394a4a8