From 3af5bd8e294615eb1eb5bafe7266a34dde46f5be Mon Sep 17 00:00:00 2001 From: Bernd Bestel Date: Sun, 9 Feb 2020 15:11:38 +0100 Subject: [PATCH] Scoll to the recipe card after selecting a recipe on mobile devices (closes #547) --- changelog/56_UNRELEASED_2020-xx-xx.md | 1 + public/viewjs/recipes.js | 11 ++++++++++- 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/changelog/56_UNRELEASED_2020-xx-xx.md b/changelog/56_UNRELEASED_2020-xx-xx.md index 248cf6e0..5b4f061f 100644 --- a/changelog/56_UNRELEASED_2020-xx-xx.md +++ b/changelog/56_UNRELEASED_2020-xx-xx.md @@ -9,6 +9,7 @@ ### Recipe improvements/fixes - Optimized the ordering of the inputs on the recipe ingredient edit page (moved "Only check if a single unit is in stock" before the amount) - Variable ingredient amounts are now marked accordingly on the renedered recipe +- After selecting a recipe on mobile devices, the page now automatically scrolls to the recipe card - Fixed that when editing a recipe ingredient which had "Only check if a single unit is in stock" set, not any quantity unit could be picked and the amount stayed empty - Fixed that when reloading the "new recipe"-page (or when it gets auto-reloaded due to "Auto reload on external changes" is enabled), for each reload a new recipe was created - Fixed that the recipe "fullscreen card" was not correctly displayed diff --git a/public/viewjs/recipes.js b/public/viewjs/recipes.js index 87063fe8..044f05e1 100644 --- a/public/viewjs/recipes.js +++ b/public/viewjs/recipes.js @@ -26,7 +26,16 @@ if (typeof recipe !== "undefined") var cardId = "#recipe-card-" + recipe; $(cardId).addClass("bg-primary").addClass("text-white"); - $(cardId)[0].scrollIntoView(); + + if ($(window).width() < 768) + { + // Scroll to recipe card on mobile + $("#selectedRecipeCard")[0].scrollIntoView(); + } + else + { + $(cardId)[0].scrollIntoView(); + } } if (GetUriParam("search") !== undefined)