mirror of
https://github.com/glenndehaan/unifi-voucher-site.git
synced 2026-05-09 08:25:29 +02:00
[GH-ISSUE #88] Fully Kiosk Browser using iframe #43
Labels
No labels
bug
enhancement
pull-request
question
question
question
wontfix
No milestone
No project
No assignees
1 participant
Notifications
Due date
No due date set.
Dependencies
No dependencies set.
Reference
starred/unifi-voucher-site#43
Loading…
Add table
Add a link
Reference in a new issue
No description provided.
Delete branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Originally created by @StevenDTX on GitHub (Aug 20, 2025).
Original GitHub issue: https://github.com/glenndehaan/unifi-voucher-site/issues/88
Originally assigned to: @glenndehaan on GitHub.
The question
I have a number of tablets running Fully Kiosk Browser. Adding https://voucher.domain.com/kiosk to a Home Assistant dashboard (using an iFrame card), I believe the CSS gets messed up.
Maybe something is misconfigured on my end?
Thanks.
Fully Kiosk:
Desktop browser:
@glenndehaan commented on GitHub (Aug 20, 2025):
Hi @StevenDTX,
Looking at the screenshots you provided it seems to me like the CSS is either not loaded or gets blocked.
One thing I would try is to see if you load the page without the iframe if it loads.
If it does, then I suspect there is some cross-origin issue going on within fully kiosk. (Maybe your HA is running on HTTP and the voucher system is running of HTTPS?)
Hope this helps.
Kind regards,
Glenn de Haan
@StevenDTX commented on GitHub (Aug 20, 2025):
I loaded it directly in Fully Kiosk Browser (bypassing Home Assistant) and I get a similar result. I also get the same result whether I connect through my reverse proxy (SSL is required to present the page in HA) or if I connect to the docker directly (http://:3008).
So, it has to be something in Fully Kiosk.
Thanks!
@StevenDTX commented on GitHub (Aug 21, 2025):
Made a bit of progress! I was standing in front of the tablet (Fire Tablet 10 HD 2021) and I noticed a quick popup about "outdated webview". I discovered v90 was installed. I found a version (v108) that works with this tablet and installed it. Its much better, but still missing a couple of elements.
Is there a way to force dark mode in options.json?
@glenndehaan commented on GitHub (Aug 21, 2025):
Hey, yeah that could be indeed the issue since tailwind v4 utilizes some CSS selectors that are not working on older browsers. In terms of darkmode there is no way to force it from a config perspective since it chooses based on the device preference. May be there is way to force that within Fully Kiosk?
@glenndehaan commented on GitHub (Aug 21, 2025):
So I found a way that works on Firefox, and I think it should also work in your case. In your HA profile settings you can force the color theme:
So even tho my system color is set to dark, if I force light it also changes the behavior of the Voucher Site. Do note that i'm running the Voucher site as an addon in HA, and therefore use the sidebar tab and not the iframe. But maybe it works the same.
@StevenDTX commented on GitHub (Aug 21, 2025):
I worked out the dark mode issue.
I also installed the voucher site as an HA addon and added it via the sidebar card. Unfortunately, I got the same result.
I may just have to punt this for now and go back to my old voucher method until I can replace all of my tablets.
Thanks.
@glenndehaan commented on GitHub (Aug 21, 2025):
Ah that is unfortunte to hear. Then I will close this issue for now.