We have a hover state for the green "Update this issue" button (link) in the metadata table, but the actual buttons on forms provide no visual indication that they're being hovered over. My cursor changes, which is helpful (thanks browser), but I don't understand why these remain so static on hover.

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

eliza411’s picture

Issue tags: +D.o UX
mgifford’s picture

Issue tags: +Accessibility

So the hover state we use in the sidbar is:

a.issue-button:hover, a.issue-button:focus {
    background: none repeat scroll 0 0 #8AAF3C;
    color: #FFFFFF;
    text-decoration: none;
}

Which can just be added in like this to the submit button:

input[type="submit"]:hover, input[type="submit"]:focus {
    background: none repeat scroll 0 0 #8AAF3C;
    color: #FFFFFF;
    cursor: pointer;
    text-decoration: none;
}

I guess we'd just need a patch for this.

LewisNyman’s picture

Status: Active » Needs review
FileSize
459 bytes

As we're playing with colours we need to use a colour variable in Sass. I guess the .issue-button CSS isn't in Bluecheese? We have button styling declared in about 4 different places....

mgifford’s picture

That looks good. It applies nicely to bluecheese. I just don't have the capacity to compile the sass files.

Bojhan’s picture

Screenshot?

tvn’s picture

Project: [Archive] Drupal.org D7 upgrade QA » Bluecheese
Version: » 7.x-1.x-dev
Status: Needs review » Needs work

Thanks for working on this! Please provide a screenshot and/or link to the dev site where we can see the patch in action.

drumm’s picture

This won't work because this style:

@include background-image(linear-gradient(top, $button-background 50%, $lime-green 50%));

Always takes precedence over a solid background color. The hover state needs the same two-tone effect. (Which can't be seen on the unbranded public theme, it is all the same green.)

This should also remove the nearby

input[type="submit"]:hover {
  cursor: pointer;
}

which is replaced by this patch.

The .issue-button styles are in project_issue module's CSS, which should be cleaned up as we notice things.

LewisNyman’s picture

Ok, I'll try this again later when I can develop against the branded theme.

drumm’s picture

The public theme should have more different shades of green so we can work on this. (Or, should the smaller buttons actually be two-tone?)

DyanneNova’s picture

Here's a bzr patch that takes the background image into account for the branded theme.

DyanneNova’s picture

Status: Needs work » Needs review

drumm’s picture

Status: Needs review » Fixed
Issue tags: +needs drupal.org deployment

Looks good!

drumm’s picture

Issue tags: -needs drupal.org deployment

Now deployed.

Status: Fixed » Closed (fixed)

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