How to enable screen formatting on print (e.g. remove media type 'screen' from style tag) [#2076265]

I've verified that the print stylesheet is not being included in pages, yet all pages print with what appears to be the formatting from the print stylesheet.

Steps I've taken so far:

Verfied that the lines enabling print stylesheets in the .info file are commented out;
deleted the contents of the print.css and print.scss files;
verified that the issue is not due to browser settings [other websites work fine and behavior is observable in Chrome, FF and Safari).

What are possible causes?

Comments

Comment #1

Jeff Burnz CreditAttribution: Jeff Burnz commented 28 August 2013 at 19:04

Well, I assume you checked the file is not loading by viewing the source code, so the only thing I could think of is that you have the CSS cache turned on, so Drupal is loading the cached version.

Comment #2

escoles CreditAttribution: escoles commented 29 August 2013 at 12:39

Title:

Prints without formatting (print stylesheet NOT enabled)

» How to enable screen formatting on print (e.g. remove media type 'screen' from style tag)

Thanks -- all caching was disabled and I should have mentioned that clearing all Drupal caches and browser cache was a part of each test.

In any case, I've found the issue, now I just need to figure out how to fix it.

The problem is that the STYLE container in the HEAD which is responsible for loading the main stylesheets is set to media-type SCREEN -- e.g.:

<style media="screen">@import url("http://e3.spark:8888/sites/all/themes/adaptivetheme/at_core/css/at.settings.style.headings.css?msalig");
@import url("http://e3.spark:8888/sites/all/themes/adaptivetheme/at_core/css/at.layout.css?msalig");
@import url("http://e3.spark:8888/sites/default/files/prepro/sites_all_themes_adaptivetheme_e3_sass_global.base.css?msalig");
@import url("http://e3.spark:8888/sites/default/files/prepro/sites_all_themes_adaptivetheme_e3_sass_global.styles.css?msalig");</style>

(Missed this yesterday because of the fact that with caching disabled there six distinct STYLE containers to drive the stylesheet includes.)

So, it looks like i need to do one of the following:

Remove the media type 'screen' from the main styles tag. My preferred option since it removes dependencies rather than creating them.
Include all styles in the print stylesheet and enable the print stylesheet feature.

Is there a way to do [1]?

Comment #3

escoles CreditAttribution: escoles commented 29 August 2013 at 12:48

Status:

Active

» Closed (fixed)

And the answer was staring me in the face, in the form of the declaration syntax in the .info file.

All that's needed is to change the media type in the declaration from 'screen' to 'all', like this:

  ;stylesheets[screen][] = sass/global.base.scss
  ;stylesheets[screen][] = sass/global.styles.scss
  stylesheets[all][] = sass/global.base.scss
  stylesheets[all][] = sass/global.styles.scss

Comment #4

Jeff Burnz CreditAttribution: Jeff Burnz commented 29 August 2013 at 13:11

Status:

Closed (fixed)

» Active

OK, now I get what you want. Short answer - no, its not possible to do this without hacking AT Core theme. This could be made into a feature request however that is not going to help you right now.

What I would suggest as a plausable work around is to use @import in the print stylesheet to import all the files you need. Now, if you switch to saving the generated files in the theme (as opposed to in default/files) you will have all them available to you at sensible paths also. You can do this in theme settings.

So to import into the print stylesheet you would remove all the CSS in print.css and use something like this:

@import url("global.base.css");
@import url("global.styles.css");

I think that is going to get you really close once you have that setup and prevent you having to duplicate stuff in print.css.

Seriously I think this is a feature request for the core theme, even a bug really - its just not something I envisioned and built the theme around a set of assumptions.

Comment #5

Jeff Burnz CreditAttribution: Jeff Burnz commented 29 August 2013 at 13:19

Status:

Active

» Fixed

Yes, it can work that way some of the time, it just depends, AT does makes some hard coded assumptions about some stylesheets, for example if you use the Fonts extension and some others, it will load it with screen not matter what (its hard coded in the drupal_add_css wrappers).

If you got it working good then thats great.

Comment #6

escoles CreditAttribution: escoles commented 29 August 2013 at 13:34

Good thing I'm not using those features, then ;-).

So, it sounds like you're saying that some core AT features won't come through to the print version; that's fine for my purposes and probably will be for most other folks', as well. They just need to be cognizant of which stylesheets aren't loading.

Also, you can use @font your face module to do most of the stuff that the built in font support does and that will show up on print. I happened to be using that because it was easier to keep the config for that in one place than spread it out over module plus theme. It worked for this site; for others and for more inventive type usages, I'd have to use the AT font feature, so I can see where that will probably be a problem on future sites. (Give designers an inch - non-web-safe fonts, e.g. -- and they'll take a yard.)