[Feedback] Relative Styling

Feedback
1

Feel free to add your feedback related to Cwicly’s Relative Styling feature here.

  • Allow custom input to write the CSS, instead of building it visually.

I think that would be a decent compromise for all users.
The option to build classes visually persists, and it makes sense for quite a few users, but no one would be forced to go that (in many cases) cumbersome route.
There are also cases which aren’t covered and could only be achieved by a custom Type.

It’s a massive trade-off for me, as it takes just too much time.
There were discussions in the past, but unfortunately no update/news to date.

image
image539×633 16.3 KB

  • Make RS modal resizable. It’s required when a lot of selectors are added.

image
image540×558 21.4 KB

  • Please rethink the position of the add rule icons.

They are not only suggesting the wrong user interaction, but they also require always to go to top. It’s not fun when I need to add 5-6 rules. That applies to both - before and after.

image
image534×537 24.7 KB

  • Add focus, focus-within and focus-visible to the Pseudo classes.

image

  • Allow Type > Class values to be edited. Currently, it’s required to delete and re-enter it.

That’s clearly #2 on my list of time-wasting and frustrating things, right after the missing custom type option.

I would like to hear some more opinions on that, so any thoughts are appreciated.
Please consider improving this very unique feature.

3 Likes
2

I was just about to make a topic about this as well. I would love see freeform selector input as well.

In my example, I need to create a RS for something like:

:where(:not(.alignleft):not(.alignright):not(.alignfull))

It’d be a lot easier to input that manually instead of creating a rule for every single selector in there.

Edit: Nvm, looks like you can actually accomplish that with just one rule because of the :where selector. But there are definitely other examples where this would be handy :slight_smile:

1 Like
3

@sunny, It’s coming, but does require a shift in the style rendering logic as well as some extra time to make sure it all works properly :slight_smile:

@Marius, these are all great points and we’ll definitely be including them in the coming weeks.

Thanks as always for sharing and helping make Cwicly better everyday!

3 Likes
4

That’s great to hear. I’m sure there’s a lot more to it behind the scenes. Thank you for making Cwicly better everyday!

1 Like
5

Found something that might be useful to consider when re-working the RS selectors.

I don’t think it’s currently possible to create a RS that looks like:

:where(.the-global-class) h3

I’m not quite sure how to work that in the UI though.

6

This is a very good point, thanks for bringing this up @sunny.

Another use case which is currently not possible would be something like this:

[class^="partial-class-name"]

Relative Styling not only gives one the possibility to create classes but also to manage them in a specific place.
That’s why I think it would still make sense if it’s possible to remove the block/global class as a default selector and start completely from scratch.

image

1 Like
7

Another feature request I’d add in addition to the above is support for nested relative styles. Essentially, I want to be able to add relative styles inside relative styles. If used carefully, this could allow for quite elegant organization and application of targeted styling rules.

8

Hello everyone,

Just reacting to this thread to keep things up to date.

A lot has been done to Relative Styling since, including free-form rules which now allow you to achieve very particular sets as well with the unique .blockclass and :pseudos dynamic selectors, added in 1.2.9.9.1.
More features and improvements are already planned for Relative Styling also.

Feedback is welcome, so please don’t hesitate!

Sorry for not reacting earlier to your post, @avunu. I’d love to have a bit more detail (or a specific example) if possible so that I can picture this generally.

Cheers,

9

Hey @Louis.

Amazing update that comes with a pretty elegant solution, well done and thank you!

I have a couple of points which initially came to my mind:

  • Could the .blockclass and :pseudos selectors be uneditable? So, when hitting backspace once, the “item” is gone. And when typing it manually, it transforms automatically into the “fixed” selector item.
  • Could the free-form rule stay in place when switching back to the RS builder interface? Currently, when switching, the input vanishes. Of course, only the visible rule (visual builder OR free-form) should be active/apply.
  • This one is probably “too much to ask” and won’t currently work out, specifically because of the free-form :pseudos selector. But would it be somehow possible to sync both the visual builder and the free-form rule? This would be extremely useful in quite a few scenarios.

Looking forward to any further improvement here.

10

Definitely on the same page after trying this out recently, I already requested this:

11

Just in case it got lost a bit and to extend my list above, I want to add this here as well.
It’s a crucial point when using Relative Styling with pseudo elements.