auto collapse or scale image which has large height

[adoyle-h]

Describe the solution you'd like

When post an image whose size is 600 × 5000px, it will takes up a lot of space of the notes flow.

I wish the large image to be scaled down to a fixed size. And click image to view the raw size.

Type of feature

User Experience (UX)

Additional context

No response

[RoccoSmit]

You can try adding your own CSS to limit timeline image sizes

Go to settings -> system -> additional style and add

.flex.flex-col.justify-start.items-start.w-full.max-w-full img {
  max-height: 200px;
}

You can change the 200px to the size you prefer the tallest image in your timeline to be

[adoyle-h]

@RoccoSmit I tried. But it will show small height when clicked. I wish to click image to view the raw size.

And the .flex.flex-col.justify-start.items-start.w-full.max-w-full img is so complicated. Can you add css class names to each div? such as class="note".

[RoccoSmit]

the CSS selector only looks for images in the red box

When you click the image it opens in a dialog that does not live in the red box so the image is the raw size again

Regarding using class names on elements, this is a separate discussion that should get its own issue created and the people in the know can add their input