Tools Menu Presentation Is A Mess

[TiddlyTweeter]

Its seems contradictory to me that the Tools Menu has both on hover descriptions of each item and a side description. It ruins that menu on narrow screens.

I don't really understand why you bother with the side descriptions at all. They seem redundant and just make formatting for smaller screens more complicated than it needs to be.

See this discussion on Google Groups for some background: https://groups.google.com/forum/#!msg/tiddlywiki/aeSNtKO06o4/-M9LC3jnCAAJ

[twMat]

IMO that type of brief explanation is exactly what the tooltip functionality is for.

...and, as you point out, they DO in fact function as tooltips!

I agree with the implied suggestion in the OP: Skip the explicit desctiptions to get a much cleaner list.

[Jermolene]

Hi @TiddlyTweeter the reason that we have the explicit descriptions in the “Tools” menu, rather than just relying on the tooltips, reflects one of the development policies of TiddlyWiki: because hover effects don't work on touch devices we don't rely on the user being able to see them.

If you want to hide them, CSS would seem the way to go.

[danielo515]

Tooltips does not work at all on mobile devices, and they do not play well with screen readers. I think those are good reasons to not relying on them solely.

[twMat]

@Jermolene

because hover effects don't work on touch devices we don't rely on the user being able to see them.

If I understand, there are established solutions for this, using double-tap. This is, from what I read, also usable on iOS.

Maybe this is of use for a TW widget?

Add onclick="" to anything you wish iOS to recognise as an element with a hover.
 <div onclick="">Click Me!</div>

Source. And in here they add an alternative to the previous

<div class="image-container" onclick="void(0)">

[TiddlyTweeter]

@Jermolene

This is a good example of me not knowing enough. But also, I think, naivety having some merit.

On the one hand I really don't know how you folk cope with all the variations on devices & platforms. I'd go ballistic if I had to deal with it.

On the other hand it seems a bit of a contradiction that explanations added for smaller screen (mobile) users are more likely to break the screen layout than is the case on widescreen desktops where they are not needed?

I note @twMat's comments, coming from a more experienced place than mine, so I'll leave this issue open for the moment.

[Jermolene]

Hi @twMat those workarounds mean that it takes a double click to actually use a button, which makes things a lot slower and more awkward.

@TiddlyTweeter the approach that TW5 takes is called “mobile first web design”, it roughly means making sure that things work on the lowest common denominator platform (smartphones), and then adding enhancements for more capable platforms. In TW5's case, things are more optimised for tablets that smartphones, and we've yet to do any enhancements specifically for desktop. Such things might belong in a plugin.

[TiddlyTweeter]

@Jermolene FWIW I use a tablet as well as a desktop. Same as a desktop its fine in landscape. The layout issues come in portrait, on both. My tablet, though, is a Windows Surface Pro, so its behaving mostly like a desktop.

[tobibeer]

@Jermolene: I would think that "mobile first" implies: "Do not overload the ui with burdensome text". In case of the tools, I think the descriptions should simply not be there as the OP suggests.

For what action are they truly necessary?

To me, they are distracting both on the large screen as well as on mobile.

Also, there should not be any checkboxes next to the buttons. Those kinds of modifications should only be done in the ControlPanel. The sidebar is for navigation only and easy access, it's not a controlpanel replacement.

[pmario]

@TiddlyTweeter -- IMO this one can be closed. We did not change is 6 years ago. So it is very likely, that it will be a "wontfix"