Allow alternate logo on mobile view

[ampburner]

Under admin > customize, I have the ability to specify custom css and a html-header for both the desktop and mobile views (independently)

But the site logo is always the same (shared between both views)

I would like the ability to specify a separate image for the mobile view, because my logo is not suitable for small screen displays:

(The font looks kind of crappy on mobile)

This has the additional advantage of saving bandwidth and faster loading times.

Possible implementations:

• additional setting for the mobile logo (empty defaults to desktop logo)
• allow to override the image via a stylesheet somehow? If that’s possible.

[downey (Michael Downey)]

Yes please. This is a problem for anyone with wider logos, I think.

It should be possible with CSS media queries.

This would also help with our hack to get a higher-resolution logo in there for HiDPI displays.

[ampburner]

How would you do it with media queries? I guess that you would only be able to manipulate it via css if the image is a style background-image, but not as long as it’s an img src?

[downey (Michael Downey)]

See html5 - Media Query: Image src property change using css - Stack Overflow or Google around for several different techniques.

[riking (Kane York)]

I just finished this feature:

https://github.com/discourse/discourse/pull/2454

[ampburner]

Awesome! Much appreciated!