-
-
Notifications
You must be signed in to change notification settings - Fork 3.7k
Open
Labels
Qv2 🔝Quasar v2 issuesQuasar v2 issuesarea/componentsbug/1-repro-availableA reproduction is available and needs to be confirmed.A reproduction is available and needs to be confirmed.flavour/quasar-cli-vitekind/bug 🐞
Description
What happened?
The sticky element disappears, and re-appears after closing the dialog
actual_firefox.mp4
What did you expect to happen?
The sticky element is still displayed in the background (like it does in Chrome)
expected_chrome.mp4
Reproduction URL
How to reproduce?
Steps to reproduce:
- Place a sticky element in the application
- Make application scrollable
- Open the application in Firefox
- Scroll to the bottom
- Open a dialog
Flavour
Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)
Areas
Components (quasar)
Platforms/Browsers
Firefox
Quasar info output
Operating System - Linux(5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/142.0.0.0 Safari/537.36) - linux/x64
NodeJs - 20.19.1
Global packages
NPM - 10.8.2
yarn - 1.22.19
pnpm - 8.15.6
bun - Not installed
@quasar/cli - undefined
@quasar/icongenie - Not installed
cordova - Not installed
Important local packages
quasar - 2.17.4 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
@quasar/app-vite - 2.4.0 -- Quasar Framework App CLI with Vite
@quasar/extras - 1.17.0 -- Quasar Framework fonts, icons and animations
eslint-plugin-quasar - Not installed
vue - 3.5.24 -- The progressive JavaScript framework for building modern web UI.
vue-router - 4.6.3
pinia - Not installed
vite - 7.2.4 -- Native-ESM powered web dev build tool
vite-plugin-checker - Not installed
eslint - 9.39.1 -- An AST-based pattern checker for JavaScript.
esbuild - 0.25.12 -- The cross-platform WebAssembly binary for esbuild, a JavaScript bundler.
typescript - Not installed
workbox-build - Not installed
register-service-worker - Not installed
electron - Not installed
@electron/packager - Not installed
electron-builder - Not installed
@capacitor/core - Not installed
@capacitor/cli - Not installed
@capacitor/android - Not installed
@capacitor/ios - Not installed
Quasar App Extensions
*None installed*
Networking
Host - quasarframeworkstackblitztempl-ei3x
en0 - 192.168.1.104Relevant log output
Additional context
This happens because q-body--prevent-scroll sets position: fixed. One possible solution would be to not change the position, but just change overflow to hidden, and set padding-right to scrollbar width, to avoid layout shift when opening/closing dialog on a scrollable page. Bootstrap modal uses this solution.
OS: Windows 11
Metadata
Metadata
Assignees
Labels
Qv2 🔝Quasar v2 issuesQuasar v2 issuesarea/componentsbug/1-repro-availableA reproduction is available and needs to be confirmed.A reproduction is available and needs to be confirmed.flavour/quasar-cli-vitekind/bug 🐞