Content hidden when printing

[robinpoort]

As I was working on a client site today I realised that Houdini content was hidden and only the Houdini buttons were displayed. Because I know you care about displaying content when JS is disabled I figured you'd want the same experience when printing the web.

As a second feature the auto-generated buttons are also hidden on print. The buttons inside [data-houdini-toggle] stay visible since they act as headings for the toggled content.

An even better approach would be to make these settings by using SCSS variables so you can easily override compiled output when compiling the styling in your own projects. Let me know if you'd be interested in that so I can create an issue for it and start working on that.

[cferdinandi]

So, two things:

1. If JS was disabled, those elements wouldn't be hidden in the first place and would print.
2. I think there's a strong argument to be made that if the content is hidden because the person hasn't clicked the button to show it, it shouldn't be in the print version, either.

[robinpoort]

1. Yep I know. I was trying to make a point about the page not being used as "most" devs intend it to be used. Most devs don't take into account that JS might be broken or disabled, or that people try to print pages.

2. Fair enough, good point. My client is using an accordion markup listing an FAQ area though. They wanted the answers to be printed as well which I can get into. Might be different for each use-case though.

In that light, putting in an option, and making devs aware that people might printing their pages might still be a valid option though? If not, I'll just add the print CSS to each individual project which needs it.

Just thought I'd share and give back :)

[cferdinandi]

That's a fair point. Let me check with some a11y friends around expectations for something like this.

Thanks!