Bug - No print style

[mgdhs]

What I did

On a UI toolkit enabled page or site, try printing the page. It prints out information that is not relevant, missing or corrupt.

While you may laugh and ask who prints a page any more, our users still do. Approximately 1.5% of our all our sessions result in a print. While this may seem like a small percentage, it is a high number of people and sessions. The most printed material is for our older population.

What browser and device I was using

All

What I expected to see

When printing a page, I get a print optimised output. It includes the coat of arms and site name, but otherwise it is minimal, nice typography and no navigation.

What I saw

Print - Components - DTA Design Guide.pdf

Print - About us - govCMS base theme.pdf

Per-component information designed for screen was also leaking to print. Because print doesn't support background colours, these often came out incomplete.

Additional information (optional)

There are a number of different ways to resolve this:

1. Design each component to print the mobile-first styles, and @media print specific fixes. This is a pretty radical change to each component.
2. Change existing styles to only display for screen (via how the styles are imported into the page) and develop a print-specific stylesheet. The print-specific stylesheet imports existing components such as typography. It would also have its own specific styles for layout, coat of arm placement, etc. The downside is each component does not get any print styles and per-component print styles are managed outside of the component.
3. Somewhere in the middle. For example, start with option 2, but @import components/* where @media print.
4. Some other solution.

We'll likely implement option 2 in the short term in the govCMS base theme.