Page MenuHomePhabricator

Watch (☆) and Wikilove button in toolbar should not have an underline on hover
Closed, ResolvedPublic

Description

Description

Because Watch (☆) is not a tab it should not get an underline on hover:

currentupdated
image.png (280×2 px, 103 KB)
image.png (280×2 px, 103 KB)

The wikilove icon also has this, (as shown on user pages)
{F35265879}

QA

  • Watch icon should have no underline on hover
  • Wikilove icon should have no underline on hover

Event Timeline

ovasileva triaged this task as Medium priority.Jun 17 2022, 12:55 PM

@alexhollender_WMF if we're making visual changes here, might I suggest we also do T234990 while we are here?

Change 807600 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[mediawiki/skins/Vector@master] Remove hover and focus states on article toolbar links

https://gerrit.wikimedia.org/r/807600

Jdlrobson renamed this task from Watch (☆) button in toolbar should not have an underline on hover to Watch (☆) and Wikilove button in toolbar should not have an underline on hover.Jun 22 2022, 10:46 PM
Jdlrobson updated the task description. (Show Details)

Change 807654 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[mediawiki/skins/Vector@master] Remove hover effect on icon tabs

https://gerrit.wikimedia.org/r/807654

I looked into this and I think we should go with the quick fix here. Both of these icons have the non standard "icon" class which we can use to distinguish them from the others. We can revisit in quarter 1 when we work on the more dropdown. I'll leave a comment on T234990 with what we can do in quarter 1.

Change 807654 abandoned by Jdlrobson:

[mediawiki/skins/Vector@master] Remove hover effect on icon tabs

Reason:

This is no longer working since Jan's recent refactoring. Hopefully not too hard to get it working again.

https://gerrit.wikimedia.org/r/807654

Change 814234 had a related patch set uploaded (by Jdrewniak; author: Jdrewniak):

[mediawiki/skins/Vector@master] Refactor chevron implementation across components

https://gerrit.wikimedia.org/r/814234

Change 814234 had a related patch set uploaded (by Jdrewniak; author: Jdrewniak):

[mediawiki/skins/Vector@master] Refactor chevron across components + separate watchstar

https://gerrit.wikimedia.org/r/814234

Change 814234 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Refactor chevron across components + separate watchstar

https://gerrit.wikimedia.org/r/814234

This has been in production since 28th July.

QA:

Macbook Pro
Chrome
Vector 2022

  • Watch icon should have no underline on hover
  • Wikilove icon should have no underline on hover

Clip from https://en.wikipedia.org/wiki/User_talk:Vdubs81
There is an underline under Wikilove icon on hover:

Screen Recording 2022-08-18 at 4.17.24 PM.mov-65D59D48-2643-4583-947D-B437EA9BA577.gif (137×720 px, 128 KB)

@Jdlrobson is this ticket just for Vector 2010 or does scope of this ticket also cover Vector 2022?


One note, in Vector 2022, there is currently no active outline shown when tabbing to Wikilove icon on user pages, though because the underline is still displaying, the user can see that the Wikilove icon is active. I am not sure if this existed before this ticket or not, so this may be out of scope, but am noting it here. clip from https://en.wikipedia.org/wiki/User_talk:Vdubs81 :

{F35477319}

@vaughnwalters Scope of this ticket should be Vector 2022 only. Vector legacy is unaffected.

@vaughnwalters Scope of this ticket should be Vector 2022 only. Vector legacy is unaffected.

Okay thanks, updated my findings in T310838#8167382 to reflect this.

underline is still showing on Wikilove icon. Will look into this.

Change 824303 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[mediawiki/skins/Vector@master] [WIP] Visual enhancements: Icons

https://gerrit.wikimedia.org/r/824303

Test wiki created on Patch demo by Jdlrobson using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/dcb2317c72/w

The fix for this should also addresses various other bugs: T315615, T310838, T234990
Please review the patch demo and move to code review if it looks good, needs more work if not.

Test wiki created on Patch demo by Jdlrobson using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/dcb2317c72/w

as far as I can tell the watchstar already doesn't have an underline on hover. how can I test the wikilove button in patchdemo?

I don't see the WikiLove icon. Happy to sign off with a screenshot from you though.

Screen Shot 2022-08-26 at 12.27.29 PM.png (904×2 px, 159 KB)

You need to log in as a user other than Bob. The Wikilove symbol only shows on user pages that are not you.
Try https://patchdemo.wmflabs.org/wikis/dcb2317c72/w/index.php?title=User:Patch_Demo&useskin=vector-2022

You need to log in as a user other than Bob. The Wikilove symbol only shows on user pages that are not you.
Try https://patchdemo.wmflabs.org/wikis/dcb2317c72/w/index.php?title=User:Patch_Demo&useskin=vector-2022

I can't figure it out. Can you post a screenshot while hovering and then move to sign-off?

Test wiki created on Patch demo by Jdlrobson using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/fc355bcae6/w

Confirming no underline on hover for watchstar. For wikilove button, that will be handled in T234990: Replace 'watchstar' and 'wikilove' icon with WikimediaUI default. Resolving.

ovasileva claimed this task.

Change 824303 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Icons: Watchstar and wikilove are upgraded

https://gerrit.wikimedia.org/r/824303

Test wiki on Patch demo by Jdlrobson using patch(es) linked to this task was deleted:

https://patchdemo.wmflabs.org/wikis/dcb2317c72/w/

Test wiki on Patch demo by Jdlrobson using patch(es) linked to this task was deleted:

https://patchdemo.wmflabs.org/wikis/fc355bcae6/w/