Issue #3056✓ SolvedOpened September 30, 2020by micker2 reactions

Option for responsive design

快速解答by MartinPutz2

@micker If I'm understanding you correctly, then this is already implemented, when you change the styles of a component on a given device, a media query will be used. You can see that on the demo page: https://grapesjs.com/demo.html You can change the device to mobile, change the width of something and go back to desk...

Read full answer below ↓

Question

hello i am not sure its not already implement but i didn't find where => with grap we can change display for check responsive option but we can't change option for specific device ? like change size of block on smartphone exemple image what do you think about this ?

Answers (3)

👍 Most helpfulMartinPutzOctober 3, 2020

@micker If I'm understanding you correctly, then this is already implemented, when you change the styles of a component on a given device, a media query will be used.

You can see that on the demo page: https://grapesjs.com/demo.html

You can change the device to mobile, change the width of something and go back to desktop. The change is only applied for the mobile device. You can click on the view code icon at the top, scroll down to the bottom and you will see the media queries.

mickerOctober 3, 2020

Ah cool

theSC0RPOctober 21, 2020

@MartinPutz I have implemented the responsive feature as shown in the getting started guide but when I click on the mobile icon, the layout is only squished. (The two-column layout does not change to two-row. Only the width is reduced) Can you pls help me if you have worked on the responsive design?

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Free option

Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.

Browse free plugins →
Premium option

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.