elegantapp / pwa-asset-generator

Automates PWA asset generation and image declaration. Automatically generates icon and splash screen images, favicons and mstile images. Updates manifest.json and index.html files with the generated images according to Web App Manifest specs and Apple Human Interface guidelines.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Allow background images

djmtype opened this issue · comments

Is your feature request related to a problem? Please describe.
There is no way to choose an image to use for a background; only css.

Describe the solution you'd like
A way to specify the path to a background image.

Additional context
An example of a prompt for splash screens:

pwa-asset-generator public/logo.svg ./assets -b public/bk.jpg --splash-only

Hi @djmtype, that's already possible in the current version. You can either use CSS background URLs or your custom HTML inputs to accomplish that.

Examples;

# Option 1
pwa-asset-generator icon.svg ./assets -b "url(https://wallpapercrafter.com/sizes/2560x1440/10631-starry-sky-stars-space-dark-astronomy-4k.jpg) no-repeat center center fixed"

# Option 2
pwa-asset-generator icon-with-custom-bg.html ./assets

@onderceylan The one thing I wanted to mention, in order to use Option 1, I couldn't reference an image relative to my project. It's required the url address needs to be from full url address? So using url(/public/bk.jpg) or url(./public/bk.jpg) or url(public/bk.jpg)didn't work in any case.

That's right. It has to be a remote URL, or a local web server URL in your machine. If you really need to use relative path, best option would be doing that with your own html input. It provides so much flexibility including using relative image paths.

best option would be doing that with your own html input.

Exactly, thank you.