open-eats / OpenEats

:pizza: Self Hosted Recipe Management App :hamburger:
https://open-eats.github.io/
MIT License
670 stars 102 forks source link

Printing grocery lists are blank #107

Open toddobryan opened 4 years ago

toddobryan commented 4 years ago

I tried printing a grocery list from both Chrome and Firefox and the page is just blank.

Am I doing something wrong?

RyanNoelk commented 4 years ago

Thanks for reporting. You're right, it's not working. Will look into a fix for this :)

toddobryan commented 4 years ago

Thank goodness. I thought it was me. I'd also be interested in helping out with the combining of ingredients.

toddobryan commented 4 years ago

As a workaround, you can tell Chrome and Firefox to use the screen CSS rather than the print CSS: https://superuser.com/questions/846082/how-to-get-wysiwyp-print-what-you-see-in-a-web-browser

toddobryan commented 4 years ago

I think I've traced the problem, but I can't figure out where it's coming from.

@media print {
  body * {
    visibility: hidden; }

appears in one of the <style> tags, but I've searched for other stuff in that tag in the web and api folders and can't find them. But changing the visibility to visible for printing might help :-)

toddobryan commented 4 years ago

OK. More investigation. I think the problem is that in this file https://github.com/open-eats/openeats-web/blob/master/modules/list/css/grocery_list.scss there's no mention of the classes that need to be printed for a grocery list, similar to the @media print section here: https://github.com/open-eats/openeats-web/blob/master/modules/recipe/css/recipe.scss#L224

Sorry I couldn't figure out anything more, but I'm CSS illiterate and know even less about SCSS. :-)