Claro: Wrong background for active vertical tab

The background should be white like on larger screens.

One set of screenshots is all that is needed for each patch. Here, there are three sets, which makes it confusing and harder to review. Please, do not add new screenshots after they have already been added!

Remove the bg-color as advised in #18. Attached interdiff with #10. Attached patch for same. Please review

The last submitted patch, 19: 3327848-19.patch, failed testing. View results →

Able to reproduce the issue using steps in IS
Applied patch #19 on Drupal 10.1.x-dev
The patch applied cleanly.
The background gets removed from the active verticle tab on smaller screens
Refer to the attached screenshots

RTBC +1

I confirm @DeepaliJ's findings!

RTBC ✅

The solution appears to deviate from the original Claro designs. Perhaps someone involved with the design such as @ckrina or @saschaeggi should approve or potentially recommend a solution that preserves the design.

The root cause seems to be that we're using incorrect media query in Claro for this rule. This implements a fix according to the designs; keeps the light blue background on mobile and overrides that with a white background on desktop.

This fix isn't entirely correct because Drupal.behaviors.verticalTabs allows configuring the breakpoint through drupalSettings. Since the variable would be needed in media query, we would have to use custom media query for this. That is not supported by any browsers so there probably isn't any value in implementing that right now.

The Needs Review Queue Bot → tested this issue. It fails the Drupal core commit checks. Therefore, this issue status is now "Needs work".

Apart from a re-roll or rebase, this issue may need more work to address feedback in the issue or MR comments. To progress an issue, incorporate this feedback as part of the process of updating the issue. This helps other contributors to know what is outstanding.

Consult the Drupal Contributor Guide → to find step-by-step guides for working with issues.

Tried to fix CCF for #25.

Patch #27, contains few irrelevant files.

core/modules/block/src/BlockMachineNameGenerator.php
core/modules/block/src/BlockMachineNameGeneratorInterface.php

I have fixed one comment in #25. Please review

This issue is being reviewed by the kind folks in Slack, #needs-review-queue-initiative. We are working to keep the size of Needs Review queue [2700+ issues] to around 400 (1 month or less), following Review a patch or merge request → as a guide.

Confirmed this issue on Drupal 10.1 and that the patch #28 solves it.

Looks like my patch in #25 introduced an off-by-one error 😅 Because this one is a min-width and the other usage is a max-width, we need to increase the breakpoint by one px.

This is committed to 10.1.x and cherry-picked to 10.0.x. Lauri points out that Drupal.behaviors.verticalTabs allows the breakpoint to be configurable, but I'd still consider this an unqualified fix as the media query now matches default breakpoint value. Having it match the configured value (of which there is no evidence of it being used) is something that deserves its own scope.

Issue credit was not granted to the many, many screenshots provided after a perfectly good set was already there. +1s without additional issue-advancing content also did not receive credit

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