Page MenuHomePhabricator

[SPIKE] Consider a "compact" theme for Codex
Open, Needs TriagePublic

Description

Background

Like WikimediaUI, Codex design emphasizes readability, usability, and accessibility. This often involves a comfortable amount of spacing to ensure that all users, regardless of device, disability, etc., can easily perceive and interact with the interface.

However, this spacing often represents an amount of whitespace that constitutes a significant changes from past designs. There are a few issues here:

  • UIs that display a dense set of data can become more difficult to use with additional whitespace. Less fits into the viewport at once, and it can be cumbersome to need to scroll and look at a larger space to get the information you need or interact with the UI
  • Some people prefer and are accustomed to a denser interface
  • (more?)

While we want to follow research-based recommendations and requirements for user experience and accessibility for general users, we should consider providing a way for certain users or interfaces to opt into a more condensed layout.

Possible solutions

A compact theme

The most ideal solution is probably an actual theme for Codex that reduces whitespace in a consistent way and can be opted into via user preferences or feature settings (configured per ResourceLoader module, perhaps). This would involve overriding the values of design tokens, meaning values would be changed in one place and propagated throughout the system. This would require a more robust theming system than Codex currently has, but would be a good long-term goal.

A user stylesheet

In the meantime, we could work with the community to develop a user stylesheet that makes Codex components more compact via style overrides. This is less than ideal because overriding tokens would be impossible (until we can use CSS custom properties), so we would need to write style overrides.

Acceptance criteria

  • Get community feedback/participation
  • Consider other use cases
  • Brainstorm more solutions
  • Open a task for the preferred solution