Discourse Density Toggle

Install this theme component

This theme component allows users to set the density of their view of a Discourse forum. It includes default, cozy, and compact.

13 Likes

Awesome work, as usual, Jordan!

I noticed on iPadOS 18.1.1 that the menu doesn’t appear when clicking on the button in the sidebar. I do see the button focused, but nothing pops up. If I switch to desktop mode, it works.

EDIT: Actually, as long you are in mobile view.

It seems to be z-index issue:


Another minor UX issue: The current density value is not selected by default the first time you visit the preferences. (On a side note, the labels don’t seem localized.)
Edit: I think it’s more related to the value that has not yet been saved to the browser storage.

I can see in the code that it’s ready to change the font, but I don’t see any interface for it. I assume this will be implemented later?

5 Likes

A few remarks when using compact:

Avatar’s flair keeps the regular size, which looks weird, and they overlap posts’ content.

Suggested and Related buttons at the end of a topic overlap the topics list below.

User preferences have a font size setting.
I don’t think the compact view should alter the global font size at all. They should remain separate settings.

The topic map container doesn’t use 100% of the width. It should normally reach the right side.

Same with the footer buttons.

In the regular layout, .topic-meta-data, which contains the date, has a right padding that aligns the date with reply buttons:

This is not the case with the compact layout:

The absence of the horizontal line that separates posts in the regular layout makes the post list right side look weird. The dates and reply buttons are too close to each other. Each button and the date below look like they’re parts of the same post, but they actually belong to different posts.

2 Likes

Yes, it’s all written and works properly, but I didnt want to introduce it just yet.

thanks for your other reports. I will look into them :smile:

3 Likes

The Install this theme component button here is not configured properly as it results in this:

… and it fails with this message

An error occurred: Error cloning git repository, access is denied or repository is not found.

It expects only the URL (without the markdown part)

2 Likes

Thanks for reporting, this is fixed.

1 Like

Hi again. Just tried the compact view together with Enhanced (AI summaries) view selected. The result is not likable. I guess the combination doesn’t make much sense but it’s possible to select it.

1 Like

A small observation. In compact mode if there is a flair, it goes over the post’s text.

1 Like

Thanks for the reports Thomas, I will take a look.

It’s the first thing I mentioned in my reply :smile:

I’d be interested in hearing opinions about whether a compact view should alter the font size when a dedicated setting is already available.

It’s not a big deal obviousy as I won’t jump from a density setting to another twice a day… Being curious more than anything here.

I had a quick look at a few software that offers various density modes. I compact mode,

  • Discord and Google Gmail/Calendar don’t change the font size.
    I believe Slack doesn’t too (I didn’t try, just looked at screenshots)

  • Microsoft Outlook reduces the font size from 14px to 12px.

2 Likes

It’s a good question Canapin.

While creating the component I tried a couple different scenarios and decreasing the font size always felt like the best option.

1 Like