-
-
Notifications
You must be signed in to change notification settings - Fork 70
Open
Description
Alto and Dawn double-print @site.logo
<img>
when @custom.white_logo_for_dark_mode
exists:
<img src="{{@site.logo}}" alt="{{@site.title}}">
{{#if @custom.white_logo_for_dark_mode}}
<img src="{{img_url @custom.white_logo_for_dark_mode}}" alt="{{@site.title}}">
{{/if}}
At first, I thought of creating an if/else switch to control which <img>
tag to print (see PR 373).
However, that still wouldn't handle cases such as...
- the user uploads
@custom.white_logo_for_dark_mode
but then switches the color scheme to light. Under current logic/PR 373, the dark logo would still show. - the user uploads
@custom.white_logo_for_dark_mode
and sets the color scheme to auto. Under current logic/PR 373, the dark logo would always show.
I think the logic needs to be more complex to handle the theme's automatic light/dark theming. Something like...
- if
{{#match @custom.color_scheme "Dark"}}
and@custom.white_logo_for_dark_mode
, print<img>
for@custom.white_logo_for_dark_mode
- if
{{#match @custom.color_scheme "Auto"}}
and@custom.white_logo_for_dark_mode
, print<img>
for@site.logo
and@custom.white_logo_for_dark_mode
and add IDs/classes anddisplay: none
CSS to control which<img>
renders - else print
<img>
for@site.logo
Metadata
Metadata
Assignees
Labels
No labels