search

cncf / cncf.io

☁️♮🏛🚧 The CNCF.io WordPress website
https://cncf.io
MIT License
82 stars 37 forks source link

Make case studies look good when printed #429

Closed cjyabraham closed 3 years ago

cjyabraham commented 3 years ago

Create print CSS if needed or whatever works best.

thetwopct commented 3 years ago

I've added some print CSS for all pages (removing header/footer, keeping logo) with additional focus on single case studies.

Current:

(Before) AlphaSense | Cloud Native Computing Foundation.pdf

After - I think I scaled back the design too much here

(After) AlphaSense | Cloud Native Computing Foundation.pdf

After v2 - this follows the online design closer but just tidies it up:

(After v2) AlphaSense | Cloud Native Computing Foundation.pdf

Let me know any feedback or changes.

cjyabraham commented 3 years ago

I like After v2 the best!!

cjyabraham commented 3 years ago

It looks like "After" has been deployed. Did you explicitly choose that one or was it an accident? I got the sense we both liked "After v2" better?

thetwopct commented 3 years ago

I'll have to look in to it. The code to generate After v1 was deleted to get After v2 so having trouble understanding how that is working... I only checked print styles in Safari so that could also be related (I believe Safari defaults to printing background colours and images and without those it could look like After v1)

thetwopct commented 3 years ago

I can't seem to reproduce v1 styling, they all match v2. But v2 is hard to replicate exactly across all systems as different browsers handle background graphics differently. If we want more consistency, the styling should be very basic and just focus on text and images.

Safari default

Chrome-without-background-graphics

Chrome-with-background-graphics

Edge

Firefox

cjyabraham commented 3 years ago

Ah, I see. I needed to turn on background graphics.

All seem fine now except for some on Safari have the first page mostly blank:

Up to you if you want to fix this...

thetwopct commented 3 years ago

I thought I had avoided that and I can't seem to find any commands that fix it or control when or if it happens. If it's a deal breaker let's remove the print styles as it never seems to happen when the browser just prints the page.

cjyabraham commented 3 years ago

Let's just leave for now... since it doesn't happen in FF or Chrome perhaps it's a bug in Safari that they may fix.