Provide `tab-size` option and decision token
Closed, ResolvedPublic
Actions

Assigned To

Authored By

	Volker_E
	Nov 9 2022, 2:18 AM

Description

Background

A small token category, best in typography meta category situated: We also need to define tab-size. It's used in a few places in MediaWiki, and also in VitePress default styles.
This has to be a theme decision that we have to be able to cover.

Context is theme-ability of typographic style in <code> or <pre> elements, in an example like this:
https://www.mediawiki.org/wiki/Manual:Coding_conventions/CSS#Specificity

As folks have strong opinion over text styles, this might be asked to change when using Codex in context outside MediaWiki.

Proposal

theme options:
tab-size-100: 4

decisions
tab-size-base: tab-size-100

Goal

Define tab-size option and decision tokens.
With default value 4 in WikimediaUI theme.

Details

	Project	Branch	Lines +/-	Subject
	mediawiki/core	master	+664 -637	Update Codex from v0.3.0 to v0.4.0
	design/codex	main	+11 -0	tokens: Add `tab-size` token

Customize query in gerrit

Related Objects
Search...

Status	Subtype	Assigned	Task
Duplicate		• STH	T302348 <Platform Initiative> Release Codex in Beta (Limited Production Release)
Invalid		None	T302025 Upgrade Codex to Beta version
In Progress		Volker_E	T293127 [EPIC] Design System Foundation: Design and define design tokens
Resolved		None	T314086 Design System Foundation: Define & Implement Critical "Global" Visual Styles
Resolved		bmartinezcalvo	T295991 Define and document the visual guidelines for styles/design tokens of the Codex design system in Figma
In Progress		Volker_E	T296995 Define the system's color palette
Resolved		Volker_E	T297584 [Spike] Design System: Re-evaluate color palette nomenclature and numerals
Resolved		Volker_E	T305236 Create visited red link color token
Resolved		Volker_E	T313502 Tokens: Color subtle features different color than WikimediaUI Base's and evaluate 'accessory'
Resolved		ldelench_wmf	T322833 Update Yellow 600 for warning color
Resolved		Volker_E	T324449 Add new colors used in Message component and update border colors to the darkest tone
Resolved		• EUdoh-WMF	T322960 Define `accent-color` design token
Open		Sarai-WMDE	T296998 [Epic] Define the system's typographic styles and scale
Resolved		Volker_E	T322707 Provide `tab-size` option and decision token
Resolved		Sarai-WMDE	T297000 Define the design system's size and spacing scale
Resolved		Catrope	T324367 Enable Codex tokens to work with different font sizes
Open		None	T326900 Vertical centering issues of text/multiline text and icons in several components
Resolved		ovasileva	T328053 Verify impact of Design Systems Team's Codex Update on Web properties
Resolved	BUG REPORT	Volker_E	T329287 TypeaheadSearch: Search footer icon shrinks at 14px base font size
Resolved		Volker_E	T297001 Define the system's opacities
Resolved		Volker_E	T305084 Add 0.3 opacity
Resolved		Volker_E	T297003 Define the system's box shadow styles
Resolved		Volker_E	T310409 Button: Simplify focus styles application including `box-shadow`
Resolved		Sarai-WMDE	T297007 Define the system's iconography
Resolved		Volker_E	T300562 Define Border tokens
Resolved		bmartinezcalvo	T302181 Define the system's cursors
Resolved		Catrope	T304443 Document Motion tokens (animations and transitions)
Resolved		DAbad	T303522 Decide on CSS breakpoints for the design system
Resolved		Volker_E	T322712 tokens: Add `background-position` option and decision token with value `center`

Event Timeline

Volker_E created this task.Nov 9 2022, 2:18 AM

Volker_E updated the task description. (Show Details)Nov 9 2022, 10:45 PM

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

[design/codex@main] [WIP] tokens: Add `tab-size` token

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

gerritbot added a project: Patch-For-Review.Nov 9 2022, 10:49 PM

The classification of this token as part of the typography category appears to make sense. Would there be any other tab-size values that we'd need to document? Also: what's the reason we don't use the default value?

What you mention...

This has to be a theme decision that we have to be able to cover.

Would be enough to justify the creation of this single token. Nevertheless, it'd be great to document the exact use case that we're trying to cover and its reach. Neither this ticket nor the patch include any details regarding why is this token needed and how it will be used.

Change 855152 merged by jenkins-bot:

[design/codex@main] tokens: Add `tab-size` token

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

Maintenance_bot removed a project: Patch-For-Review.Nov 29 2022, 1:30 AM

A small token category, best in typography meta category situated.

I need a little push to be convinced of the need to document this in Figma. We're making this token available specially for themers: do designers need to be exposed to this property? What do you think, @Volker_E and @bmartinezcalvo?

Not necessarily. There could be a minor case for layouting code blocks, but I think that's so rare that the existence of the token might be still not relied on.

Volker_E updated the task description. (Show Details)Nov 29 2022, 10:46 PM

Change 865151 had a related patch set uploaded (by Eric Gardner; author: Eric Gardner):

[mediawiki/core@master] Update Codex from v0.3.0 to v0.4.0

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

gerritbot added a project: Patch-For-Review.Dec 6 2022, 6:59 PM

Change 865151 merged by jenkins-bot:

[mediawiki/core@master] Update Codex from v0.3.0 to v0.4.0

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

Maintenance_bot removed a project: Patch-For-Review.Dec 6 2022, 7:31 PM

Volker_E closed this task as Resolved.Dec 8 2022, 12:00 AM

Volker_E claimed this task.