Fix thumbnail left alignment

[sevonj]

Describe the bug Left thumbnail alignment does not affect embeds. As a result, thumbnails on the feed bounce left and right depending on the post type, which is somewhat annoying.

Edit: More left align issues

To Reproduce (if applicable)

• Set thumbnail alignment to left
• Browse in list view

Tasks:

• [x] (list view) - Apply thumbnail alignment to embeds. #344 80fff16671b9e519148456eaa7c96cb545072115
• [x] (list view) - Consistent horizontal position of meta block. #353
• [x] (compact view) - Consistent horizontal position of meta block. #340
• [x] Alt text is obscured by the left sidebar. 6c047be49d3f8bda9de81fd083c4716864274f43

Expected behavior Consistent thumbnail position on both alignment options.

Screenshots

Versions

• Browser: Firefox
• Photon version: 1.29.5

[sevonj]

I spent some more time thinking about ways to make left alignment look cleaner.

I don't like these paths at all:

The best idea I have so far is this:

• Use normal "media" item for embed thumbnails when leftAlign is on.
• Reserve the space even if there is no media when leftAlign is on.
  • Maybe put some kind of text post symbol there.
• Change the layout so that embed comes after media.

Title and meta moved above in list view:

Compact mode:

@Xyphyn Opinion on having roughly this kind of layout for leftAlign?

[Xyphyn]

Sure I completely forgot about left alignment

[sevonj]

I rebuilt that draft and pushed it to https://github.com/sevonj/photon/tree/left_align

It's rough, but I think the the layout idea is ok.

Changed views:

• list (left align)
• compact (left align)
• compact (right align)

Screenshots

List left  Compact left  Compact right 

[sevonj]

I wasn't really happy with my previous draft for list view. Left and right alignments had different layouts and it looked kinda weird anyway.

So I had another go: My new approach doesn't try to bend the embed thumbnails to match the normal ones. They stay in the embed card. Instead, I made the normal layout more consistent with embeds by moving the meta block above.

We could also increase the size a bit, maybe even match the width of the embed thumbnail.

Edit: https://github.com/sevonj/photon/tree/listview-leftalign-draft

[sevonj]

I guess I'll add alt text to the list.

[sevonj]

I see that list view layout has become near identical to compact layout.

At this point, instead of working a new solution, I suggest just removing the filter for selfposts in PostMediaCompact to make it consistent.

https://github.com/Xyphyn/photon/blob/80fff16671b9e519148456eaa7c96cb545072115/src/lib/components/lemmy/post/media/PostMediaCompact.svelte#L20C1-L20C3

[sevonj]

Looks like we're done here!