Problem/Motivation

When the submit button for the views bulk actions form is disabled it gets the grey text, but the background remains blue.

This is most apparent when using the Views Bulk Operations module as it has javascript which disables the button until content has been selected and an action has as well.

It seems that during the update to move the bulk actions into the floating bar at the bottom of the view, some CSS was missed/not removed. This was intentional in #3070558: Implement bulk operation designs

This line is setting the background colour, which overrides the disabled rule.

Steps to reproduce

  1. Install standard profile
  2. Add some content
  3. Visit admin/content, inspect the "Apply to selected items" button and add the disabled attribute to it.

Proposed resolution

Copy disabled styling into tableselect.css?

CommentFileSizeAuthor
#12 3378091-disabled-primary-button-gray-text-blue-background-bad-contrast-12.patch1.27 KBedmund.dunn
#5 Screen Shot 2023-07-31 at 11.20.28 am.png40.26 KBacbramley
#2 Screen Shot 2023-07-31 at 9.54.27 am.png28.11 KBacbramley

Issue fork drupal-3378091

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

acbramley created an issue. See original summary.

acbramley’s picture

acbramley commented
Issue summary: View changes
StatusFileSize
new Screen Shot 2023-07-31 at 9.54.27 am.png28.11 KB
acbramley’s picture

acbramley commented
Issue summary: View changes

It seems like this colour was intentionally set in #3070558: Implement bulk operation designs - probably better to just add the :disabled classes into tableselect.css too?

acbramley opened merge request !4512

acbramley’s picture

acbramley commented
Status: Active » Needs review
StatusFileSize
new Screen Shot 2023-07-31 at 11.20.28 am.png40.26 KB

This seems to do the trick (never done CSS changes in core so apologies if I've altered the files incorrectly 😅)

acbramley’s picture

acbramley commented
Issue summary: View changes

Gauravvvv made their first commit to this issue’s fork.

gauravvvv’s picture

gauravvvv commented

The .views-bulk-actions__item overrides only the background color of the primary element; there is no need to modify the button's color.

lauriii made their first commit to this issue’s fork.

lauriii’s picture

lauriii
he/him
Primary language Finnish
Location Finland
commented

I pushed alternative solution to the MR that avoids copying the disabled styles to the tableselect styles.

acbramley’s picture

acbramley commented
Status: Needs review » Reviewed & tested by the community

This is why I stay away from CSS 😂

Much nicer solution and works perfectly, thanks @lauriii!

edmund.dunn’s picture

edmund.dunn commented
StatusFileSize
new 3378091-disabled-primary-button-gray-text-blue-background-bad-contrast-12.patch1.27 KB

Posting the static patch because using the MR doesn't allow pinning to a specific commit, so anyone can submit pretty much anything and inject it into our codebase IIRC. This also fixed our issue.

Status: Reviewed & tested by the community » Needs work

The last submitted patch, 12: 3378091-disabled-primary-button-gray-text-blue-background-bad-contrast-12.patch, failed testing. View results

lauriii’s picture

lauriii
he/him
Primary language Finnish
Location Finland
commented
Status: Needs work » Reviewed & tested by the community

Random fail

Status: Reviewed & tested by the community » Needs work

The last submitted patch, 12: 3378091-disabled-primary-button-gray-text-blue-background-bad-contrast-12.patch, failed testing. View results

acbramley’s picture

acbramley commented
Status: Needs work » Reviewed & tested by the community
larowlan’s picture

larowlan
Location 🇦🇺🏝.au GMT+10
commented

Updating credits

larowlan’s picture

larowlan
Location 🇦🇺🏝.au GMT+10
commented
Status: Reviewed & tested by the community » Fixed

Committed to 11.x and backported to 10.1.x

thanks!

  • larowlan committed 89e557f9 on 10.1.x 
    Issue #3378091 by acbramley, lauriii, Gauravvvv: Disabled primary button...

  • larowlan committed 38618b1e on 11.x 
    Issue #3378091 by acbramley, lauriii, Gauravvvv: Disabled primary button...
idebr’s picture

idebr commented
Version: 11.x-dev » 10.1.x-dev

Status: Fixed » Closed (fixed)

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