Refactor Claro's views-ui stylesheet

I have refactored the code, please review

This could use more nesting. Lost of instances (too many to full note each) but example
.views-config-group-region .views-group-box--value > .form-item::before {
.views-config-group-region .views-group-box--value > .form-item::after {

Tried to improve nesting. attached interdiff for same

Nesting seems much better.

The last submitted patch, 11: 3332743-11.patch, failed testing. View results →

improvised nesting :)

Please provide an interdiff.

And since we have changes again will probably need another before/after screenshots.

Working on this issue as a part of Claro Contribution Day.

Made required changes. Removed @nest from the code as per guidelines mentioned here.
Please find attached images for before and after of both LTR and RTL language patterns.

AkshayAdhav → changed the visibility of the branch 3332743-claro-views-ui-refactor to hidden.

Converted #18 to MR

finnsky → changed the visibility of the branch 3332743-refactor-claros-views-ui to hidden.

Gonna work on it a bit

Switching to another issue.
It still needs work at least in terms of source file formatting and variables usage.

Let me take a look into it again.

Hi @finnsky
I have made the required changes for file formatting as well as tried to use variables wherever possible. Apart from properties where values are in decimals.

Also, I have kept the padding-bottom property as it is as per the comment on top of it.

.filterable-option .form-item.form-type-checkbox {
  padding-block: calc(var(--space-xs) / 2);
  /* This selector is aggressive because Claro's reset for .form-items is aggressive. */
  padding-bottom: calc(var(--space-xs) / 2);
  padding-inline-start: calc(var(--space-xs) / 2);
}

With latest changes thing we need new screenshots

Just one set

Updated some logical properties and removed duplicated selectors. Still needs screenshots.

Hi @Gauravvvv
We should not include @nest. That's why I have removed it in my previous commit.
You can check this link for reference.

Nice catch @AkshayAdhav

Probably you can create issue to remove @nest usage?

@finnsky I think we should make @nest related changes while refactoring only.
But I guess most of us are missing this point, so we can create new issues if required.

Yep. I've checked. Sadly lot of that @nest were added in recent refactor tickets :)

Damn... Then we need to create child tickets for each refactor related issue tickets.

@smustgrave attaching the screenshots with the latest changes.

Hi @Gauravvvv
We should not include @nest. That's why I have removed it in my previous commit.
You can check this link for reference.

We discussed this some time back, please see Drupal slack Conversation also, an issue.

Also as noted on a few tickets and in slack now. The @nest tickets should be consolidated into one.

Changes here seem fine thanks for the screenshots.

I'm triaging RTBC issues → . I read the IS.

I then read the MR and found an @todo with a link to a closed issue. That is not a review as I don't do front end. I am setting this to needs work.

Addressed feedback of #39. please review

Now it points to a closed issue.

Now it points to a closed issue.

The reference is correct; however, the earlier issue it pertains to is a duplicate of this closed issue. We can create a new issue to address that.

So we are saying this will be revisited in a closed ticket? Therefore it’ll never actually be revisited.

So since the referenced issue is closed we may need to revisit it now in this ticket.

So we are saying this will be revisited in a closed ticket? Therefore it’ll never actually be revisited.

here I meant that we can create a new issue for this.

So since the referenced issue is closed we may need to revisit it now in this ticket.

Yes we can do it. Moving to NW to revisit this.