Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

White PNG/SVG images are not visible in the panel #6378

Open
gbdesign2023 opened this issue Apr 1, 2024 · 2 comments
Open

White PNG/SVG images are not visible in the panel #6378

gbdesign2023 opened this issue Apr 1, 2024 · 2 comments
Assignees

Comments

@gbdesign2023
Copy link

gbdesign2023 commented Apr 1, 2024

  • Add an image with the block or layout editor
  • Upload a PNG/SVG with white fill and transparent background
  • Only a white area is visible, which is irritating because I can't see if/which image is hidden behind it.

image-1

Wouldn't it be great to display the pattern in the background by default, as adapted by the cards/cardlets?

It also would be great to be able to change the background using the same principle in the blueprint:
https://getkirby.com/docs/reference/panel/sections/files#preview-images__back

I solved it with a simple CSS class in custom-panel.css:

.k-block-type-image-auto {
    background: var(--pattern);
}

image-2

I am aware that I can customize the block type. But there will be many (new) users who are happy about such useful little details if they are already part of the core functions of Kirby.

It is not a bug, but a cosmetic improvement for the panel.

Kirby 4.1.2

@distantnative
Copy link
Member

The question is what we'd want for when ratio is not set (or set to auto:

Still have the pattern behind the whole container? Or should it really just be behind the img element?

Screenshot 2024-04-01 at 21 55 12

@gbdesign2023
Copy link
Author

gbdesign2023 commented Apr 1, 2024

@distantnative That will be a question of personal taste. One person likes it, another doesn't. I don't mind if the entire background is patterned. This is also how I know it from the file blueprint:

file-blueprint

The fundamental question is whether it makes sense to integrate this function into the core system or leave it as an individually programmable option.

The gallery block is of course also affected by this:

.k-block-type-image-auto, 
.k-block-type-gallery {
    background: var(--pattern);
}
gallery

[Edit] I have just noticed the difference between k-block-type-image-auto and k-block-type-image. k-block-type-image-auto seems to be the better choice for me. However, I have not yet tried it with image formats that do not correspond to the usual conditions.

@distantnative distantnative self-assigned this May 1, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants