All breakpoints mode

Feature Requests
1

It may be useful to have a way to apply your styles to the base breakpoint regardless of which one you are currently in.

This will be very useful in the case of a client or editor who only does basic text formatting changes and/or adds components.

They may add a component or block in the lg breakpoint and then apply styling to it, not realising their styles haven’t been applied (for example to the smaller breakpoints in a mobile first approach, or the larger breakpoints in desktop-first approach).

Having this “All breakpoints” mode, would simplify the editing experience for them and prevent confusion.

This can potentially be toggled from within the Role Editor.

2 Likes
2

Brilliant, I like these innovating ideas :slight_smile:

I think I would also like a toggle inside the editor, so that as admin I can quickly switch mode, and edit global styling while previewing any breakpoint view.

3

Yes, I was thinking the same thing also.

As it will help with these kinds of situations:

4

Definitely!
I encountered this issue numerous time. I integrate a website on the large breakpoint… but -of course- styles only apply to the biggest breakpoint.

Like I commented on this feature request:

It would be really handy to be able to select/change a breakpoint / state via a right click or better to allow us to rename the classe directly via a double-click on the class label. It would be even faster especially for groups.

5

I like this too :+1:

6

Now that we are using Tailwind for more client sites, this is a really necessary feature.

To be able to specify “For any user with the Editor role, by default, apply any styles to the base breakpoint” will really help for non-technical clients who just want to align their text or change the colour when they happen to be viewing the site in desktop breakpoint at that moment.

1 Like
7

Having built my first site with Tailwind, I also think this is a good idea.

Always working in mobile view isn’t as enjoyable.

1 Like
8

Yep. All TW classes should be applied to “base” by default.

9

Related discussion: Tailwind: Dark Pseudo Class only for Colors

There are indeed a lot of properties that can be independent from either breakpoint or color mode, even more when using Cwicly global colors (with native light/dark variations) and fluid variables, and such switches could really simplify and speed up the workflow.
(With a keyboard shortcut, please :pray: )

An option would be to keep unlocked the layout options (flex, grid, …) so that even in all breakpoints mode, we can alter layout according to breakpoint, but that might be a little confusing, I admit :rofl:

10

Another quick idea which could prevent adding a switch for devs:

Some keyboard trick like SHIFT + CLICK/ENTER on a property to apply it to base instead of current breakpoint.

Not sure though it is easily applicable to all inputs.

11

These are nice ideas for devs or technical users, as long as it can be simple for non-technical users by default. :+1:

The original request was primarily focused on making sure our clients are looked after, so that is my biggest priority for this request.

12

Thinking about it more, something like this may work really well to invert the current mode for the specific property.

So, if you are in “normal mode” it applies the current property to all breakpoints AND if you are in “all breakpoints mode” it applies the current property only to the specific breakpoint.