Ensure that tabledrag user interface is usable within Olivero

Added some styles. Change for `olivero.theme` was taken from Claro.

Please do not ask the testbot to try again until #3207086: [HEAD BROKEN] Consistent failure in MonthDatePluginTest is fixed.

#3207086: [HEAD BROKEN] Consistent failure in MonthDatePluginTest is fixed. I have not reviewed the code.

1. +++ b/core/themes/olivero/css/components/dropbutton.pcss.css
   @@ -11,6 +11,10 @@
   +.dropbutton-single .dropbutton-widget {
   +  border: none;
   +}
   

   What is this solving?

2. +++ b/core/themes/olivero/css/components/tabledrag.pcss.css
   @@ -5,12 +5,46 @@
   +a.tabledrag-handle,
   +.touchevents a.tabledrag-handle {
   ...
   +.draggable a.tabledrag-handle {
   

   Nit pick: could we remove the a element from the selector?

3. +++ b/core/themes/olivero/css/components/tabledrag.pcss.css
   @@ -5,12 +5,46 @@
   +.touchevents .draggable td {
   +  padding-block: var(--sp1);
   +  padding-inline-start: 0;
   +  padding-inline-end: var(--sp1);
   +}
   

   The padding here seems a bit excessive. We would meet the recommendation of 44px touch area with much less padding.

@mherchel Patch #13 looks good!

The table sort is looking and working as expected (see attached).

The table select sort is showing an overlapping issue, which is caused by the CSS properties coming from the Webform module (see attached). I believe this is out of scope for this particular issue and might not be something that Olivero should be accounted for, however, I just wanted to quickly note this.

Marking this issue as RTBC +1

1. These selectors are needed to override the tabledrag module's CSS (See screenshot below)

   We don't necessarily need to add element to the selector to increase specificity to override the CSS, we could do something like .tabledrag-handle.tabledrag-handle for example but here it probably doesn't make a huge difference so this is probably good as it is.

2. Let's make sure that the colors used here provide sufficient color contrast. For example, it doesn't seem like the drag-previous background color has enough contrast with links: https://webaim.org/resources/contrastchecker/?fcolor=0D77B5&bcolor=E7EDF1

While checking the table drag, I found an a11y color contrast fail at /admin/structure/block.

After the table drag, the link text color updated to #313637, which results in a fail with bg color: #2494DB.

Adding screenshots for the same.

Just tested this out on the Tugboat instance at https://3191725-tabledrag-safemtjuagapxqgtrynoasiupl4ahux6.tugboat.qa/ and it worked as expected. I'm marking this as RTBC.

Here's a video recording of me using the tabledrag feature on the Article Form Display form and the Admin Menu form.
Monosnap video: https://monosnap.com/file/JN1v5UilMA9MjAaV6bZ1E819ZCqUsa

Should we check with @jwitkowski79 if the designs are acceptable?

I also noticed that the new color rules have a regression with dropbuttons:

@mherchel reviewed the above with me and it looks good! It has my sign off

@jwitkowski79 thank you for confirming that the design changes look good for you!

We should still address the regression I mentioned in #23.

I tested a couple things and am including some screenshots:

1. /admin/structure/taxonomy as noted in #28
2. /admin/structure/types/manage/article/display as noted in the issue summary

The taxonomy UI looked okay to me and I was able to drag things fine.

For the manage display page, although dragging works, IMO it seems like:

1. Everything is too big
2. There should be some padding in the cells so things don't touch the borders

It's hard to tell the sizing in the manage display UI in those screenshots so uploading one more screenshot.

More screen shots from the taxonomy page. I agree that while functional, things look a bit off. That said, Olivero isn't designed as an admin interface and this issue is about the functionality. For that reason +1 RTBC.

Screenshots attached show taxonomy vocab page, dropbutton in action, and re-ordered taxonomy terms

I tested table drag in a quick edit. It seems like there are some issues with overflow. Do we want to resolve that here or move that into a follow-up?

Committed fac878c and pushed to 9.3.x and 9.2.x. Thanks!