Contrib.social

How to make custom logo adjust in dark mode

Open on Drupal.org →
Created on 18 July 2023, over 1 year ago
Updated 19 July 2023, over 1 year ago

Problem/Motivation

I am using the Gin Admin theme for a few college websites which need to be themed to the college's specification. I wanted to replace the drupal icon that appears on the toolbar and the gin login page with the college's logo.

I checked the Gin Admin Theme documentation to see how to do this, but I was unable to find any information on the logo. I attempted a few things unsuccessfully:

1) PNG logo: I uploaded a png logo which looked great in light-mode but terrible in dark-mode. This was to be expected though as I can't upload an alternative dark-mode logo.

2) SVG logo: I uploaded an svg logo, but this appears invisible in the toolbar. I did a test to see if this was an issue with the svg. I went into /themes/contrib/gin/media/icons/general and found the gin.svg icon that is used in the toolbar by default (I think). I picked circle.svg for the purpose of testing, and uploaded that to the logo image section in the gin settings. Just as before, this logo was invisible and did not function the same as the default logo. Screenshot included.

Is anybody able to recommend another step I can try to get the logo working with both light & dark mode?

Steps to reproduce

For the SVG version:

1) Click Appearance
2) Click Gin settings
3) Disable "Use the logo supplied by the theme"
4) Upload the /themes/contrib/gin/media/icons/general/circle.svg logo
5) View the theme in light & dark mode. The logo should be invisible.

💬 Support request
Status

Closed: duplicate

Component

Documentation

Created by

🇨🇦Canada ciesinsg

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024