I have read and followed all the instructions provided in the README.md.
I am on the latest version of Open WebUI
I have provided the exact steps to reproduce the bug in the "Steps to Reproduce" section below.
Expected Behavior:
Icon should be a squircle, as is the case in IOS PWA. Please see issue #1886
Actual Behavior:
Icons are square. Apart from the icon, the PWA works as expected
Dock
Launchpad
Description
Bug Summary:
macOS PWA Icon in launchpad/dock is square image
Reproduction Details
Steps to Reproduce:
Deploy an instance of Open-webui
Install the app as a PWA on your macOS device
See the icon at Dock/Launchpad
Notes
This is a very minor bug, but I tried looking at the src code to see where it could be fixed but I can't find the references on how to resolve it. If anyone can provide any guides or points on where to start, that would be awesome. Thanks!
Originally created by @reddiedev on GitHub (Aug 8, 2024).
Original GitHub issue: https://github.com/open-webui/open-webui/issues/4461
# Bug Report
## Installation Method
Self-hosted Docker installation via Digital Ocean droplet. Add the PWA on macOS via the icon on the address bar in Chrome
## Environment
- **Open WebUI Version:** v0.3.12
- **Ollama (if applicable):** None, I use Perplexity pipeline
- **Operating System:** Ubuntu 24.04 LTS
- **Browser (if applicable):** v119.0.6045.105 (Official Build) (arm64)
**Confirmation:**
- [x] I have read and followed all the instructions provided in the README.md.
- [x] I am on the latest version of Open WebUI
- [x] I have provided the exact steps to reproduce the bug in the "Steps to Reproduce" section below.
## Expected Behavior:
Icon should be a squircle, as is the case in IOS PWA. Please see issue #1886
## Actual Behavior:
Icons are square. Apart from the icon, the PWA works as expected
Dock
<img width="50" alt="SCR-20240808-qbpx" src="https://github.com/user-attachments/assets/d63bb13e-b6ea-4363-81b1-b412d4ede6c2">
Launchpad
<img width="181" alt="SCR-20240808-qbxm" src="https://github.com/user-attachments/assets/2e772df3-d0b2-4500-86dd-bc7c3702dd90">
## Description
**Bug Summary:**
macOS PWA Icon in launchpad/dock is square image
## Reproduction Details
**Steps to Reproduce:**
1. Deploy an instance of Open-webui
2. Install the app as a PWA on your macOS device
3. See the icon at Dock/Launchpad
## Notes
This is a very minor bug, but I tried looking at the src code to see where it could be fixed but I can't find the references on how to resolve it. If anyone can provide any guides or points on where to start, that would be awesome. Thanks!
Looking good for me. How are you installing the PWA? What browser, how did you install it?
<!-- gh-comment-id:2275878454 -->
@sebdanielsson commented on GitHub (Aug 8, 2024):
<img width="116" alt="image" src="https://github.com/user-attachments/assets/68860f1a-77ce-4b75-a70f-ddd4551f668d">
Looking good for me. How are you installing the PWA? What browser, how did you install it?
For reference, my Open-webui instance is hosted on a digital ocean droplet and I access it with https via a Caddy server running a reverse proxy to the instance. Would that in any way affect how the logo is displayed?
I am using this version of Google Chrome: Version 119.0.6045.105 (Official Build) (arm64)
And I am on macOS Sonoma v14.6
<!-- gh-comment-id:2276082473 -->
@reddiedev commented on GitHub (Aug 8, 2024):
<img width="104" alt="image" src="https://github.com/user-attachments/assets/ec6f90db-8365-4736-b47a-49113aef1c31">
I just used this button on the address bar.
For reference, my Open-webui instance is hosted on a digital ocean droplet and I access it with https via a Caddy server running a reverse proxy to the instance. Would that in any way affect how the logo is displayed?
I am using this version of Google Chrome:
`Version 119.0.6045.105 (Official Build) (arm64)`
And I am on macOS `Sonoma v14.6`
Hi @sebdanielsson, I have the same issue. I used the install app icon as well.
Chrome version: 127.0.6533.89 (Official Build) (arm64)
Mac OS: Sonoma v14.5
<!-- gh-comment-id:2276088974 -->
@mfauveau commented on GitHub (Aug 8, 2024):
Hi @sebdanielsson, I have the same issue. I used the install app icon as well.
Chrome version: `127.0.6533.89 (Official Build) (arm64)`
Mac OS: `Sonoma v14.5`
Adding to Dock from Safari will give a rounded icon like @sebdanielsson has, but doing so in Chrome gives a square.
<!-- gh-comment-id:2276093351 -->
@justinh-rahb commented on GitHub (Aug 8, 2024):
Adding to Dock from Safari will give a rounded icon like @sebdanielsson has, but doing so in Chrome gives a square.
Thank you for that. I just tried it and it's now giving the expected rounded icon
<!-- gh-comment-id:2276100005 -->
@reddiedev commented on GitHub (Aug 8, 2024):
Thank you for that. I just tried it and it's now giving the expected rounded icon
<img width="76" alt="image" src="https://github.com/user-attachments/assets/2dd60529-1a71-4252-8f36-a76030b0fc5e">
<!-- gh-comment-id:2276135924 -->
@sebdanielsson commented on GitHub (Aug 8, 2024):
> Thank you for that. I just tried it and it's now giving the expected rounded icon
>
> <img alt="image" width="76" src="https://private-user-images.githubusercontent.com/105657266/356282724-2dd60529-1a71-4252-8f36-a76030b0fc5e.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjMxMzE2NDEsIm5iZiI6MTcyMzEzMTM0MSwicGF0aCI6Ii8xMDU2NTcyNjYvMzU2MjgyNzI0LTJkZDYwNTI5LTFhNzEtNDI1Mi04ZjM2LWE3NjAzMGIwZmM1ZS5wbmc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQwODA4JTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MDgwOFQxNTM1NDFaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT0wZDJkMDJmMWY2MjFmNjJmNWU3MDVhNGY0MzBjYTE2ZDdiZGFkMzc0NzRmN2I2NTdjMWNlNmUxOTNkZTc4ZjU5JlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCZhY3Rvcl9pZD0wJmtleV9pZD0wJnJlcG9faWQ9MCJ9.6MJmqRpgr9qc8kd_EHc5iClOBErinG6G2zwHk3j0544">
Please keep the issue open as users might want to use another browser than Safari for their PWAs.
Maybe relevant:
https://issues.chromium.org/issues/40190430#comment34
Looks like a maskable icon needs to be provided:
https://www.w3.org/TR/appmanifest/#icon-masks
@sebdanielsson commented on GitHub (Aug 14, 2024):
PR Welcome!
I could give it a shot. Where can I get a high resolution version of the icon? At least 512x512px.
<!-- gh-comment-id:2288968916 -->
@sebdanielsson commented on GitHub (Aug 14, 2024):
> PR Welcome!
I could give it a shot. Where can I get a high resolution version of the icon? At least 512x512px.
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
Originally created by @reddiedev on GitHub (Aug 8, 2024).
Original GitHub issue: https://github.com/open-webui/open-webui/issues/4461
Bug Report
Installation Method
Self-hosted Docker installation via Digital Ocean droplet. Add the PWA on macOS via the icon on the address bar in Chrome
Environment
Open WebUI Version: v0.3.12
Ollama (if applicable): None, I use Perplexity pipeline
Operating System: Ubuntu 24.04 LTS
Browser (if applicable): v119.0.6045.105 (Official Build) (arm64)
Confirmation:
Expected Behavior:
Icon should be a squircle, as is the case in IOS PWA. Please see issue #1886
Actual Behavior:
Icons are square. Apart from the icon, the PWA works as expected
Dock
Launchpad
Description
Bug Summary:
macOS PWA Icon in launchpad/dock is square image
Reproduction Details
Steps to Reproduce:
Notes
This is a very minor bug, but I tried looking at the src code to see where it could be fixed but I can't find the references on how to resolve it. If anyone can provide any guides or points on where to start, that would be awesome. Thanks!
@sebdanielsson commented on GitHub (Aug 8, 2024):
Looking good for me. How are you installing the PWA? What browser, how did you install it?
@reddiedev commented on GitHub (Aug 8, 2024):
I just used this button on the address bar.
For reference, my Open-webui instance is hosted on a digital ocean droplet and I access it with https via a Caddy server running a reverse proxy to the instance. Would that in any way affect how the logo is displayed?
I am using this version of Google Chrome:
Version 119.0.6045.105 (Official Build) (arm64)And I am on macOS
Sonoma v14.6@mfauveau commented on GitHub (Aug 8, 2024):
Hi @sebdanielsson, I have the same issue. I used the install app icon as well.
Chrome version:
127.0.6533.89 (Official Build) (arm64)Mac OS:
Sonoma v14.5@justinh-rahb commented on GitHub (Aug 8, 2024):
Adding to Dock from Safari will give a rounded icon like @sebdanielsson has, but doing so in Chrome gives a square.
@reddiedev commented on GitHub (Aug 8, 2024):
Thank you for that. I just tried it and it's now giving the expected rounded icon
@sebdanielsson commented on GitHub (Aug 8, 2024):
Please keep the issue open as users might want to use another browser than Safari for their PWAs.
Maybe relevant:
https://issues.chromium.org/issues/40190430#comment34
Looks like a maskable icon needs to be provided:
https://www.w3.org/TR/appmanifest/#icon-masks
@tjbck commented on GitHub (Aug 14, 2024):
PR Welcome!
@sebdanielsson commented on GitHub (Aug 14, 2024):
I could give it a shot. Where can I get a high resolution version of the icon? At least 512x512px.