Page MenuHomePhabricator

Extend the system's cursors
Closed, ResolvedPublic

Description

Goal

By request on design team channel, there are a few more cursors to be added to DS assets and tokens, foremost zoom and resize. Adding on to T302181: Define the system's cursors

Cursors necessary:

  • nwse-resize
  • nesw-resize
  • zoom-in
  • zoom-out

Cursors to be aligned:

  • grab and
  • grabbing need to be aligned in style (non-glove version)

Criteria for done

Design

Code

  • Cursors are added as Codex tokens

Event Timeline

Volker_E updated the task description. (Show Details)

@bmartinezcalvo In the conversation we've surfaced that the cursors should probably live as token Figma files, not being part of the documentation assets. The cursors are actually needed for component functional definitions.

bmartinezcalvo added a subscriber: STH.

@STHart I move this task to our sprint board since tokens (cursor tokens in this case) are part of our priorities.

Change 785890 had a related patch set uploaded (by VolkerE; author: VolkerE):

[design/codex@main] tokens: Add further cursor tokens on theme option level

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

Based on last feedback from @Volker_E about the Cursor Tokens, I've created 2 new proposals to test if we want to use the CSS names for options or decisions:

  • Option 1: using CSS names for options and using new names for decisions (using a middle section in the name to differentiate option names from decisions e.g. cursor-select-grab)
  • Option 2: using generic names for option tokens (e.g. cursor-hand-open) and using CSS names for all decisions except for base ones to indicate which are the base cursors (base, base-hover and base-disabled)

Here you can view and compare both proposals.

For the redesign of grab and grabbing, I've prepared this new proposal with a simpler version of the hand icons:

Captura de pantalla 2022-04-27 a las 18.57.42.png (1×2 px, 632 KB)

Tokens nomenclature

After last feedback from @Volker_E in this Figma comment we will move forward with Option 2 using he following nomenclature:

  • Options: we will use generic names for option tokens (e.g. cursor-hand-open)
  • Decisions: we will use the CSS names (e.g. cursor-grab) for all decisions except for base ones which will indicate our base cursors (base, base-hover and base-disabled)

Cursor.png (1×4 px, 160 KB)

Question:

Should we add cursor-arrow-forbidden as option token? We are not using it as decision since we use default cursor for base-hover--disabled. I think we should delete arrow-forbiden if we are not going to use it as decision.

Captura de pantalla 2022-04-28 a las 15.39.21.png (514×916 px, 97 KB)
Captura de pantalla 2022-04-28 a las 15.40.42.png (938×718 px, 227 KB)


Grab and Grabbing proposal

Regarding the grab and grabbing cursors, I created this new proposal for them. If you agree I can update these cursors with this new simpler proposal.

Captura de pantalla 2022-04-28 a las 15.38.31.png (872×1 px, 363 KB)

STH triaged this task as Medium priority.May 1 2022, 12:54 PM

@Volker_E I assign you the task, if you review it and find something to update please tell me. About grab and grabbing, what do you think about the new proposal?

STH changed the task status from Open to In Progress.May 26 2022, 12:19 AM

Can we please update with the status of this task and next steps?

Change 785890 merged by jenkins-bot:

[design/codex@main] tokens, styles: Add further cursor tokens on theme option and base level

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

Volker_E removed a project: Patch-For-Review.
Volker_E updated the task description. (Show Details)
Volker_E removed a subscriber: STH.
bmartinezcalvo added a subscriber: Sarai-WMDE.

I've review the patch and it's all ok so I move the task to Product Sign-Off (since we don't need the QTE sign off for this tokens task).

Change 823725 had a related patch set uploaded (by Anne Tomasevich; author: Anne Tomasevich):

[mediawiki/core@master] Update Codex from v0.1.0-alpha.9 to v0.1.0-alpha.10

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

Change 823725 merged by jenkins-bot:

[mediawiki/core@master] Update Codex from v0.1.0-alpha.9 to v0.1.0-alpha.10

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