[GH-ISSUE #741] Broken icon image when using a theme that alters icon colors #460

New issue

Closed

opened 2026-02-25 21:35:05 +03:00 by kerem · 2 comments

kerem commented

2026-02-25 21:35:05 +03:00

Owner

Originally created by @jasonmunro on GitHub (Aug 9, 2023).
Original GitHub issue: https://github.com/cypht-org/cypht/issues/741

🐛 Bugreport

I noticed this on mobile with a dark theme. The "three dots" icon above a message list is not displaying correctly.

Version & Environment

Rev: current master

OS: NA

Steps to reproduce

change to one of the dark themes
open a message list on mobile
observe the broken icon in the upper right of the page
...
Profit

Themes can modify icon colors, which happens here: https://github.com/cypht-org/cypht/blob/master/modules/themes/modules.php#L193 This code adds a "fill" attribute to the svg tag. However there MUST be a space at the end of the svg tag before the closing characters, otherwise the fill attribute is not correctly formatted. For example:

<svg path="..." />

this is ok, there is a space before the tag closes

<svg path="..."/>

This is not ok, there is no space before the tag closes. Without the space adding the fill attribute causes the path and fill attributes to not have a space separating them which is invalid.

Originally created by @jasonmunro on GitHub (Aug 9, 2023). Original GitHub issue: https://github.com/cypht-org/cypht/issues/741 ## 🐛 Bugreport  I noticed this on mobile with a dark theme. The "three dots" icon above a message list is not displaying correctly. ### Version & Environment  Rev: current master  OS: NA ### Steps to reproduce 1. change to one of the dark themes 2. open a message list on mobile 3. observe the broken icon in the upper right of the page 4. ... 5. Profit Themes can modify icon colors, which happens here: https://github.com/cypht-org/cypht/blob/master/modules/themes/modules.php#L193 This code adds a "fill" attribute to the svg tag. However there MUST be a space at the end of the svg tag before the closing characters, otherwise the fill attribute is not correctly formatted. For example: ```<svg path="..." />``` this is ok, there is a space before the tag closes ```<svg path="..."/>``` This is not ok, there is no space before the tag closes. Without the space adding the fill attribute causes the path and fill attributes to not have a space separating them which is invalid.

kerem closed this issue

2026-02-25 21:35:05 +03:00

kerem commented

2026-02-25 21:35:05 +03:00

Author

Owner

@jasonmunro commented on GitHub (Aug 9, 2023):

an easy fix for this would be to pad the fill attribute with a space when doing the string replace. In the themes modules just change this:

Hm_Image_Sources::$$name = $pre.rawurlencode(str_replace('/>', 'fill="'.$color.'" />', $img));

to this:

Hm_Image_Sources::$$name = $pre.rawurlencode(str_replace('/>', ' fill="'.$color.'" />', $img));

@jasonmunro commented on GitHub (Aug 9, 2023): an easy fix for this would be to pad the fill attribute with a space when doing the string replace. In the themes modules just change this: ```Hm_Image_Sources::$$name = $pre.rawurlencode(str_replace('/>', 'fill="'.$color.'" />', $img));``` to this: ```Hm_Image_Sources::$$name = $pre.rawurlencode(str_replace('/>', ' fill="'.$color.'" />', $img));```

kerem commented

2026-02-25 21:35:05 +03:00

Author

Owner

@marclaporte commented on GitHub (Aug 9, 2023):

Thank you @jasonmunro

This is a good first commit for one of our new devs.

@marclaporte commented on GitHub (Aug 9, 2023): Thank you @jasonmunro This is a good first commit for one of our new devs.