homer icon indicating copy to clipboard operation
homer copied to clipboard

PWA Statusbar color not changing

Open w0rsti opened this issue 3 years ago • 5 comments

Issue description

I've updated the colors of my Homer Dashboard, but the PWA doesn't seem to fully update the colors on my Mac and iPhone (can't check other devices, since i don't own others). The Status Bar is still blue.

Steps to reproduce the issue

  1. Change color in config
  2. Update and install PWA

What's the expected result?

  • Status Bar should either be background color or primary(?) color

What's the actual result?

  • Status bar is blue (default homer color)

Additional details / screenshot

Screenshot As you can see in the top the status bar hasn't changed and is still blue. I removed all the personal information

w0rsti avatar Jan 11 '22 10:01 w0rsti

Have noticed this as well, have tried changing a variety of the other color tags to no avail.

Deviantgit avatar Feb 28 '22 21:02 Deviantgit

This seems to be due to this line in index.html:

<meta name="theme-color" content="#3367D6">

subhamayd2 avatar May 31 '22 08:05 subhamayd2

This seems to be caused by the fact that the index.html is compiled when the image is built, and at that time the custom theme color is still unknown.

Anyone using Kubernetes can use this (ugly) workaround:

name: homer
image: b4bz/homer:latest
command: ["/bin/sh", "-c"]
args:
  - /bin/sed s/#3367D6/#FF4141/ /www/index.html > /tmp/index.html &&
    cat /tmp/index.html > /www/index.html &&
    /bin/sh /entrypoint.sh

You can probably do something similar with Docker.

Note: the stuff with /tmp is because outputting the sed output directly into index.html fails for some reason and replacing in place with the -i operator doesn't work as it can't create a backup file in the /www directory due to permission issues.

StefanNienhuis avatar Jun 16 '22 21:06 StefanNienhuis

Hi there, Following the recent changes (upgrade to vuejs3), the manifest.json customization should work. I removed the meta colors from the index.html for now because as @StefanNienhuis pointed out, it's static. BUT I will put it back and make it dynamic soon !

Let me know if the PWA status bar issue is fixed on the last release. Be ware, the icon's name changed.

bastienwirtz avatar Jul 15 '22 21:07 bastienwirtz

Still stuck on blue for me, but I am using Docker if that makes a difference.

Deviantgit avatar Jul 20 '22 23:07 Deviantgit