BUG: Default component styles incorrectly applied to device-specific media queries in v0.22.10+
Question
GrapesJS version
- I confirm to use the latest version of GrapesJS
What browser are you using?
chrome latest version
Reproducible demo link
https://app.grapesjs.com/studio
Describe the bug
How to reproduce the bug?
- Initialize GrapesJS editor with default device configuration
- Switch to tablet or mobile device view
- Add a text block component (or any component with default styles, e.g., margin: 10px)
- Switch back to desktop view
- Observe that the default styles are NOT applied on desktop
What is the expected behavior?
- Default component styles should always be applied to the base CSS rule (without media query) regardless of which device is currently selected in the editor.
What is the current behavior?
- Default styles are applied to the media query corresponding to the currently selected device, causing:
- Styles missing on desktop when component is added on tablet/mobile
- Styles missing on tablet when component is added on mobile
- Inconsistent styling across devices
version used: 0.22.12
Note: seems introduced with 0.22.10
Code of Conduct
- I agree to follow this project's Code of Conduct
Answers (0)
No answers yet.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #6685
BUG: Custom component styles are not applied after deletion and re-addition
GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v143.0.7499.193 Reproducible demo l...
Issue #4474
BUG: Running in headless mode requires window
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome 103.0.5060.134Reproducible demo link...
Issue #6369
BUG: Display order of border radius is not correct
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v130 Reproducible demo link https:/...
Issue #6409
BUG: Cannot drag to move components on mobile
GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v133 Reproducible demo link https:/...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.