In the Keyman mobile app, the keyboard “Help link” presents the welcome.htm file. Likewise, the same file is presented for help on desktop platforms and at installation time.
Do the Keyman CSS libraries offer any classes to show/hide platform-specific content? If so, is there an example that someone could direct me to?
Presently, I would append mobile instructions following desktop instructions. Both are pretty lengthy, and I’m afraid a mobile user would give up before scrolling past desktop instructions to get to the mobile help content. Or vice versa if I reversed the order. Then again, the problem increases with tablet-specific details.
Internationalization support for Keyman keyboard documentation is on the roadmap for v.19. Support for per-platform documentation is planned as part of that.
Thank you for this, I begain organizing content with a table of contents as per @Matthew_Lee 's recommendation. Then after reviewing the nice example that @Lorna posted I went that direction and discovered the <details> markup that seems to fit the bill great. I think I can demonstrate here:
View keyboard instructions for:
💻 Desktop
These are the desktop instructions.
📱 Mobile (Phone)
These are the mobile instructions.
🔲 Tablet
These are the tablet instructions.
I also learned that there is no official “tablet” emoji, so I’ll need to work on that. Otherwise, I think its a good solution for now.
The expanding tabs are repurposing code from my documentation. I use CSS tricks to show different languages and different platforms. I hadn’t mentioned it earlier because my documentation contains several of those temporary hacks @Marc likes to avoid. It also requires doubling the <head> element in PHP to use the external stylesheet, which isn’t good web design.
FYI: The downside to this collapsible solution is that it doesn’t print well if you ever need that.