Closed Bug 1536237 Opened 5 years ago Closed 5 years ago

Add Letter Spacing to the fonts panel

Categories

(DevTools :: Inspector, enhancement, P1)

enhancement

Tracking

(firefox68 fixed)

RESOLVED FIXED
Firefox 68
Tracking Status
firefox68 --- fixed

People

(Reporter: contact, Assigned: rcaliman)

References

(Blocks 1 open bug)

Details

(Keywords: dev-doc-needed)

Attachments

(4 files)

As best I can see, the fonts panel currently shows font-size, line-spacing, font-weight, font-family, and the italics toggle. It'd be awesome if it could include the selected element's letter-spacing value as well.

Status: UNCONFIRMED → NEW
Ever confirmed: true
Priority: -- → P2
Assignee: nobody → rcaliman
Blocks: 1280059
Status: NEW → ASSIGNED
Priority: P2 → P1
  • Reads the value for the letter-spacing CSS property and shows it in the Font Editor. When it is default, show the "normal" identifier. As soon as the user tries to edit it using the value slider, switch to an em-based value.

  • Tweaks the unit conversion method to support letter-spacing: using correct reference node for em units, returning high-precision results even for pixels (allow sub-pixel precision)

Attachment #9053946 - Attachment description: Bug 1536237 - Add support for letter spacing to Font Editor. → Bug 1536237 - Add support for letter spacing in Font Editor.
Pushed by rcaliman@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/e78a1f8b81db
Add support for letter spacing in Font Editor. r=gl
Backout by shindli@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/d24a6d9f361d
Backed out changeset e78a1f8b81db for ES lint failure in /builds/worker/checkouts/gecko/devtools/client/inspector/fonts/fonts.js CLOSED TREE

Depends on D25087
Simplified the convertUnits() method by externalizing the logic to get the reference node, reference box and reference font size value used when converting between units.

The result is easier to read, but more importantly it reduces the cyclomatic complexity which trips the ESlint "complexity" rule and triggers a backout.

This is failing because code in the method to convert between units trips the "complexity" rule of ESlint.
Rewriting the rule to reduce its complexity and trying again.

Flags: needinfo?(rcaliman)
Pushed by rcaliman@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/ef359a791d6a
Add support for letter spacing in Font Editor. r=gl
https://hg.mozilla.org/integration/autoland/rev/3239894a7402
Refactor unit conversion in Font Editor. r=pbro
Status: ASSIGNED → RESOLVED
Closed: 5 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 68
Attached image letter-spacing.gif

Also attaching a demo GIF, for the sake of having an image we can include in the firefox-dev newsletter later today.

Component: Inspector: Fonts → Inspector
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: