How to turn off placeholders for printing?

How to turn off placeholders for printing?

  
Hi,
I am working on my first Outsystems app.  I have a screen created using Layout_Normal  that I want to print.  I have been able to get it to print using hints from another post.  However, I would like to suppress printing of the Login_Info, Menu, and Footer placeholders.  I have tried putting the following 
@media print  { 
  .Menu { display: none; 
  .div.Login_Info {display: none;
  .div.Footer {display: none;
  div.Sidebar_Block {display: none;}
  }
in the screen style sheet (which didn't work) and in the Layout_Normal weblock style sheet (which also didn't work).  Can someone tell me what I am doing wrong or what to try?

Also can someone tell me how to do a print preview?

Thanks in advance,
Carlene Neeley



Try this:

@media print  { 
  div.Menu_Container {display: none;}
  div.Login_Info {display: none;}
  div.Footer {display: none;}
  div.Sidebar_Block {display: none;}
  }

Here's what I did:
- Removed the periods before the divs since the divs are not classes
- Added braces after each line since they're not nested
- Changed .Menu to div.Menu_Container (I could be wrong, but I think that's what is used in the default styles)

It could also be simplified to this (formatted any way you want):

@media print  { 
  div.Menu_Container, div.Login_Info, div.Footer, div.Sidebar_Block {display: none;}
  }
I hope that helps!
Britni,

Thanks for your quick reply. 

Your suggestion got me most of the way there.  The Login_Info, Menu_Container, and Footer don't print now, but the Button that I have in the Actions container still prints.  I tried adding Sidebar_BlockActions in addition to the Sidebar_Block you suggested but that did not work either.  I am still open to suggestions.

Also, do you have any idea how to do a print preview?  I have tried window.preview() and window.printpreview() but neither worked.

Thanks again for your help,
Carlene Neeley
Carlene,

Did you hide both of the Sidebar divs at the same time? I just checked the default CSS and it looks like both would probably need to be hidden.
@media print  { 
  div.Menu_Container, div.Login_Info, div.Footer, div.Sidebar_Block, div.Sidebar_BlockActions {display: none;}
  }
Do you want to see a print preview in Service Studio or your web browser?
Britni,

I too checked the default CSS and saw that both appeared to be required, so that is the way I tried it.  It didn't work.  I even tried changing the button to a link - which also did not work.  I will keep looking for clues.

I would like to do print preview in the web browser, if possible.

Thanks for all your help,
Carlene Neeley
Britni Mooney wrote:
Carlene,

Did you hide both of the Sidebar divs at the same time? I just checked the default CSS and it looks like both would probably need to be hidden.
		@media print  { 
  div.Menu_Container, div.Login_Info, div.Footer, div.Sidebar_Block, div.Sidebar_BlockActions {display: none;}
  }
Do you want to see a print preview in Service Studio or your web browser?
 
 Britni,
I just got back to this after some distractions.  I found that, while I thought I had keyed in the same thing you showed, I actually had not.  When I actually added the

@media print div.Sidebar_BlockActions {display: none;} }

text correctly, everything worked properly.
 
Thanks again for your help!!
Carlene Neeley
That's great! I'm glad I could help.

Just out of curiosity, did you have to hide both?
div.Sidebar_Block, div.Sidebar_BlockActions
Britni Mooney wrote:
That's great! I'm glad I could help.

Just out of curiosity, did you have to hide both?
		div.Sidebar_Block, div.Sidebar_BlockActions
 
 Britni,

It appears that div.Sidebar_Block addresses the "Recent Items" component and div.Sidebar_BlockActions addresses the Actions placeholder contents.  So I need both to accomplish what I require.

Thanks again,
Carlene Neeley

This was very usefull to me too, thank you very much ladies :)
btw,
Any idea how to hide the taskbox for printing? can we do it the same way? and how?
Thanks


Hi Ayoub,

Seems like the container holding the taskbox has the class ECT_FeedbackContainer...
So just add div.ECT_FeedbackContainer to your print rule.

Cheers
Thank you for the prompt reply Andre, I appreciate !!

Hello Again Andre,
I tried but it's not working though :(
Ayoub,

Dumb of me I gave you the style for the ECT not the Taskbox (facepalm).
The correct class is EPATaskbox_Container. You can use both to hide the ECT and the Taskbox.

Cheers
works a charm
Thank you very much Andre  :)