Add generic media=print stylesheet

Project:ProjectPier
Version:0.8.5.0-Beta1
Component:User interface
Category:bug report
Priority:normal
Assigned:Unassigned
Status:open - needs more info
Description

Right now there is no print stylesheet being loaded by PP and printouts have full navigation and stuff. Seeing as PP is largely for organizational/corporate environments it makes sense that people will want printouts for meetings and things, so we should make this as easy as possible.

Seeing as the templates are really just CSS, it seems to me we should be able to have just one print CSS file that we can use in all occasions. It should be free of navigation and color, but have relevant names, dates, project data and anything else relevant listed at the top.

#1
Version:» <none>

This would be a great contribution if any designers felt like taking it on!

#2

I'll do it for the team. But what needs to be printed and what doesn't.

#3

I can write the CSS but where do I add the link to the stylesheet?

#4

Sorry I haven't had a chance to work on this I have been designing a new theme for PP. The theme will have a print.css file though. If people want to wait they can, otherwise someone else should do this who has a little free time.

#5

For those designers who want to try doing this, replace this page.php file in your applications/helpers/ directory. This will create a link to a print stylesheet in public/assets/print.css. Then all you need to do is create that CSS file and away you go!

AttachmentSize
page.php_.txt 18.58 KB
#6
Version:<none>» 0.8.5.0-Beta1

This other issue is a duplicate:
http://projectpier.org/node/355

I copy here what was written there as well as add the file proposed and close the other one as duplicate (more comments here).

jwriteclub said:
As per the discussion in the forum, here is an example print style sheet.
It is relatively good, although there are still a few issues that need to be addressed. In addition, the other style sheets are currently added without the 'media' attribute set which seems to cause issues on some browsers.
In addition, I have not included a patch as I have not yet perused the code throughly enough to figure out how to 'properly' add this to the core.

AttachmentSize
print.css_.txt 1.14 KB
#7

Great effort with the print CSS Tim.

"I have not included a patch as I have not yet perused the code thoroughly enough to figure out how to 'properly' add this to the core."

I was looking through the core to find the answer to this question and here's what I found out, but tell me if i'm wrong because I've only started using PP a week ago:

  • All stylesheets are stored in the theme's path, so they are defined per theme - there are no 'core' stylesheets. I think this should stay the way it is as it allows theme developers to specify their own print.css.
  • It looks like there is code duplication in the way the templates are being used. For example, all the layouts under /application/layouts/ contain the header and footer markups.
  • There's a bug in the helper function stylesheet_tag() - I'll submit this into the issue tracker.

Although ideally it would be ideal to first fix some of the problems above, here's how we can include Tim's (or any) print stylesheet to our theme now:

  1. Place print.css into your theme's stylesheets folder. I'm using goCollab so I place it in /public/assets/themes/goCollab/stylesheets/print.css.
  2. Find the following files:
    • /application/layouts/account.php
    • /application/layouts/administration.php
    • /application/layouts/dashboard.php
    • /application/layouts/project_website
  3. In each of the files above, under the first line in the file near the top that says:

    <?php echo stylesheet_tag('xxxxx.css') ?>

    enter the following:

    <?php add_stylesheet_to_page('print.css', null, 'print'); ?>

The print.css stylesheet should now be effective.

You can also add specific print stylesheets to subsections like Task Lists to further refine the print view. The template files to edit are all under /application/views/ and you can use the add_stylesheet_to_page... as above.

For example, I wanted a clean Task list printout so I placed a print stylesheet for this purpose, called task_list_print.css in /public/assets/themes/goCollab/stylesheets/project/task_list_print.css and then added the following line to the file /application/views/task/task_list.php, just after he first 'add_stylesheet_to_page...' line near the top, like so:

<?php
  add_stylesheet_to_page
('project/task_list.css');
 
add_stylesheet_to_page('project/task_list_print.css', null, 'print');
?>

I have attached the task_list.css file - it removes additional stuff like the Add Task link, Edit, Delete and Reorder links and the task icon links.

AttachmentSize
task_list_print.css_.txt 171 bytes