inline comments accessibility issue

[fredjoe7]

when i put some images inside inline comments the yellow color makes reading difficult .. how to make it transparent or remove it ?

[drbap]

If you make a total transparent background (inline comments) you will see the text behind the span and it will be difficult to read the content.

1. You could style the background of images inside the inline comments (span tag).

<img src="path to image" style="background-color: black;">

or

2. CSS (it will adapt to any theme/subtheme of MagicUser):

.theme-dark i.muc:hover>span {
  background-color: var(--mu-background-color-2);
}

CSS Option (snippet) is better because it will only work in dark mode. You can add any color you prefer. If you want the snippet to also work in light mode, just remove the .theme-dark part.

The inline comments feature of MagicUser theme is one of the plugins I am working on (improved version).

[!note] I can also implement this background change globally (as a theme feature) when there are images inside inline comments.

All the best

[drbap]

Please check theme version 19.6.0. I added a white background to images inside inline comments. You can still use the snippet above to change it.

[fredjoe7]

updated the theme..

still looks the same

<i class="muc"><span>![[Media/Images/1ce53273d14bd787d8a108d44bb1afb8_MD5.jpg]]</span></i>

[fredjoe7]

the css snippet you provided solves my issue ... thank you

[drbap]

Ok thanks for letting me know the snippet worked well for you. The new update the background color is white for inline comments images, if the user loads a transparent png it will have white background (default). In your case, I think you are using other snippet to invert the image using blend mode as well, so the white background will not solve. Glad the snippet solved it.

Closing this issue now. Thanks.

All the best