Print/save as PDF includes message header icons

[gtandersen]

When clicking the Print icon in a message and choosing "Save as PDF", the resulting PDF includes the icons shown in the header (in a very large size):

[castaway]

This is / are the 2 buttons, "Toggle Message Headers" and "Show all headers", which are inside the "#messageContents" chunk that we prepare for printing.

I'm not entirely sure how to add CSS to the inside of an iFrame, ideally we want to do something along the lines of:

@media print {
    #printFrame > button {
        display: none;
    }
}

Or set a class on those two buttons (so we don't hide any buttons in the actual email HTML)

@kvviecien any ideas?

[kvviecien]

This is / are the 2 buttons, "Toggle Message Headers" and "Show all headers", which are inside the "#messageContents" chunk that we prepare for printing.

I'm not entirely sure how to add CSS to the inside of an iFrame, ideally we want to do something along the lines of:

@media print {
    #printFrame > button {
        display: none;
    }
}

Or set a class on those two buttons (so we don't hide any buttons in the actual email HTML)

@kvviecien any ideas?

To style an iframe, you have to do it in the element like <iframe style="width: 100%; height: 120px;"></iframe>

But to style something inside an iframe, you need to do it with JS but only if we're the owner of that iframe. iframe content is subject to the same-domain policy. If it's from our domain, we can control it, if not, we're locked out. Are we the owner of this?

[castaway]

Yes, its the iframe id="printFrame" in singlemailviewer.component.html

[kvviecien]

Then I guess we can use some JS magic for this bad boy. I'll do the thing :)