Density Toggle Component

Theme component
2

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.

image
image316×200 7.91 KB

It seems to be z-index issue:

The image displays a developer tool's interface with HTML elements, including a CSS block containing a class named "data-placeholder" with an attribute of "top," highlighted within a structure of other elements. (Captioned by AI)
The image displays a developer tool's interface with HTML elements, including a CSS block containing a class named "data-placeholder" with an attribute of "top," highlighted within a structure of other elements. (Captioned by AI)543×348 20.1 KB

The image shows a screenshot of a web developer's interface with a partially collapsed code editor displaying expanded CSS styles, including properties for max width and stacking context changes. (Captioned by AI)
The image shows a screenshot of a web developer's interface with a partially collapsed code editor displaying expanded CSS styles, including properties for max width and stacking context changes. (Captioned by AI)626×451 30.7 KB

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.

image
image215×119 2.74 KB

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