Refactor Claro's system-admin--admin-list stylesheet

Gauravvv → made their first commit to this issue’s fork.

This is looking really great! I left some comments in the MR, plus we need to make sure that each code block is separated by a blank line.

Since the .css file has changed can we get screenshots please.

Hello @smustgrave,
As requested I am attaching here after and before screenshot.
Admin design looks fine after applying patch.

Changes look good.

There are two unaddressed items from an earlier review, and I additional requested to remove the @nest syntax as it will not be part of the CSS spec. Nesting will still work, but it doesn't need the at-rule anymore.

If we don't use @nest then the output is broken

  [dir="rtl"] & {
    transform: scaleX(-1);
  }

Output:

.admin-item__link::before {
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  display: block;
  width: 1em;
  height: 1.5em;
  content: "";
  background: transparent no-repeat 50% 50%;
  background-image: url("data:image/svg+xml,%3csvg width='9' height='14' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M1.71.314L.29 1.723l5.302 5.353L.289 12.43l1.422 1.408 6.697-6.762z' fill='%23003ecc'/%3e%3c/svg%3e");

  .admin-item__link::before {
    transform: scaleX(-1);
  }
}

Addressed other points.

MR seems unmergable.

Reran the MR tests and all green.

Cleaning up the tags some.

Committed f72375a and pushed to 11.x. Thanks!

lauriii → closed merge request !3978

Automatically closed - issue fixed for 2 weeks with no activity.