How to add device manager mobile landscape?
Check the DeviceManager API For now, it's only possible to use a single condition (configurable via mainConfigObject.mediaCondition option, max-width is the default)
Read full answer below ↓Question
Hi,
Please help me add device manager mobile landscape with structure example:
@media only screen
and (min-device-width: 375px)
and (max-device-width: 667px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: landscape) {
}
Currently, i have device manager with structure:
@media (max-width: 480px) {
}
ThanksAnswers (2)
Check the DeviceManager API
For now, it's only possible to use a single condition (configurable via mainConfigObject.mediaCondition option, max-width is the default)
@artf Is there any reason why grapesjs still does not support this feature? It seems that it could be resolved just by removing mediaCondition option from the EditorConfig at all, and allowing to pass any media query for each device in the widthMedia field.
At this moment this feature is crucial to me, is there any way the result CSS could be modified? I see that there is an option to pass custom css parser but the styles related to the media queries are missing there.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #3339
Question: How to add different aspect ratios to mobile devices in the device manager.
We are working on a cms system that uses grapes js. We came up with a condition where we couldn't add aspect ratio in the "mediaCondition"...
Issue #3135
[Help Wanted] How to easily override existing component ?
For example, I want to add a double click event handler on the default video component to open the assets manager. My basic idea was to get...
Issue #1823
[QUESTIONS] How to set different styles on one element for each device. (responsive)
@arthuralmeidap can you tell guide me how to set style different style for each device. I use the mobile-first strategy. For example to set...
Issue #678
Help Wanted
Hello, 2 queries : 1) How to Add a LOGO as in Demo webpage. 2) How to move the block manager, Style Manager from Right Side to Left Side. T...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.