Design Tab Responsive CSS

In Webflow, on selecting the display mode - mobile, tablet etc - all the changes made are with respect to that mode. All media queries are set up automatically. But in Wappler, the new design tab does not work that way. It changes settings for all modes, irrespective of the selection in the design view.
The mode options in App Structure/Properties for different types of properties works well, but it has very-very limited options. I can’t event assign display mode specific classes.
Is there any way to make responsive changes in design mode, without having to write CSS media queries in code view?

Hi @nshkrsh,
As we described in a post earlier the Design panel is a work in progress, that’s why it should be activated using the “Enable experimental features” option.
The features you describe will be integrated in the final version of design tab.

Thanks for the quick reply. So, until final release, writing CSS code is the only option?

In the App Structure there are the native bootstrap 4 classes already there.

In other words in App Structure I could click a column and have the native ability to already set
Column Sizing & Spacing & Devices on a per device basis, so if i wanted i could have margin bottom set to 5 for desktop, 4 for laptop, 3 for tablet, 2 for mobile, 1 for ALL
So I tend to get away without manually typing too many media queries currently.

The Design Tab is in a testing phase still so if you need something specific that you can not do through the App Structure itself then you would have to probably write manual media queries currently.

Alright. Will try it out. Have just started using Wappler so still figuring out the UI. Thanks for the help.

No problem, if you get stuck you always have this extra helpful community of real users.

1 Like

@Teodor @psweb Is there any plan to merge the Style & Design panels? Or, will the Design panel also support breakpoints in a future release? Currently only Style panel supports responsive breakpoints.

Yes it will support breakpoints :slight_smile:
Design panel is still an experimental feature / work in progress.

Cool. Can you share it’s release timeline, if any? :grin:

It will be integrated really soon :slight_smile:

1 Like

I would say also Webflow is very very limited in alot of criterias. Especially with Dynamic Content. Visually you can change alot and I love how you quickly can change Styling of „Tables“ Gradients, Shadows etc.

2 Likes

yes, indeed. webflow is limited in quite a few things.
and wappler is ahead in others.
i’d out my money on wappler - but they really have a ton to do to be a real good visual front and back end development tool.

1 Like