Export Changes - add Copy Rule button

RESOLVED FIXED in Firefox 67

Status

enhancement
P2
normal
RESOLVED FIXED
5 months ago
5 months ago

People

(Reporter: rcaliman, Assigned: rcaliman)

Tracking

(Blocks 1 bug)

unspecified
Firefox 67
Dependency tree / graph

Firefox Tracking Flags

(firefox67 fixed)

Details

Attachments

(1 attachment)

Add button that allows copying the full contents of the changed CSS rule.
Shows when hovering over the CSS rules in the Changes panel.

UI: https://mozilla.invisionapp.com/share/VFQC7MQSD9W#/screens

When CSS rules are nested (ex: style rule in @media, @supports), the button shows next to the innermost hovered rule. This defines the scope of the copy operation: if the innermost rule is hovered, only its contents get copied. If the outermost or intermediary rules are hovered, they get the Copy Rule button and define the scope.

The clipboard output is identical to the one implemented in Bug 1524547.

Adds a button that shows up when hovering selectors in the Changes panel.
When clicked, it invokes the same Copy Rule behavior implemented for the context menu: copies the full content of the rule with changes applied.

The added/changed CSS class names use BEM notation. I intend to refactor the Changes panel stylesheet to BEM in a follow-up patch.

Pushed by rcaliman@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/96e76fdfd8b2
Add Copy Rule button to Changes panel. r=pbro

Removed unused CSS custom properties which tripped a pedantic test and pushed again.

Flags: needinfo?(rcaliman)
Pushed by rcaliman@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/f5629bb3e671
Add Copy Rule button to Changes panel. r=pbro
Status: ASSIGNED → RESOLVED
Closed: 5 months ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 67
You need to log in before you can comment on or make changes to this bug.