nextcloud / cookbook

🍲 A library for all your recipes
https://apps.nextcloud.com/apps/cookbook
GNU Affero General Public License v3.0
534 stars 91 forks source link

Recipes are only partially printed or printed incorrectly #2185

Open Vrumfondel1 opened 7 months ago

Vrumfondel1 commented 7 months ago

Description Recipes are only partially printed or printed incorrectly

Reproduction Steps to reproduce the behavior:

  1. Enter or import any recipe
  2. Click on "Print recipe"
  3. See error

Actual behavior The recipes are only displayed partially or with blank pages (see screen shots and attachments)

Screenshots Manually created recipe Screenshot and PDF Manually created recipe Manually created recipe.PDF

Imported recipe Screenshot and PDF Imported recipe Imported Recipe.PDF

Browser Tested with different Android Browsers on Samsung Galaxy Tab S7+ (Dex) and with Edge and Chrome on Windows

Versions Nextcloud server version: 27.1.5 Enterprise Cookbook version: 0.10.5 Database system: MySQL 10.5.19

RobboBT commented 7 months ago

Will only print ingredients, does not print instructions. tested in Chrome, Safari and Firefox.

Hagar01 commented 4 months ago

I had a similar issue - different browsers printed differentley. I had to replace the following css line from RecipeView.vue -

grid-template-rows: 100% 100% 100% 1fr;

with

grid-template-rows: auto 1fr;

This also had the effect of displaying on the screen better. This line was forcing each section to be the same length, even though 1 might be missing or shorter. It also affected printing in that it was stretching the sections to large blank areas. Please don't specify the size of the grid-rows - let them set their own size based on the current sizes. Currently you have the height set to 300% instead of auto