css-facebook-react-add-two-selectors

A painting is a person's account of this edit as text, recorded independently of the node mapping - a rendering often has several equally defensible answers where the mapping has one. Deletions and insertions carry no position on the opposite side in a painting, so that panel draws no caret for them.

Before…lines 1–46 unchanged (46 lines)
47}
48
49.SuspenseScrubberBeadSelected {
50  height: 1rem;
51  background: var(--color-background-selected);
52}
53
54.SuspenseScrubberStep:hover > .SuspenseScrubberBead,
55.SuspenseScrubberStep:hover > .SuspenseScrubberBeadSelected {
56  height: 0.75rem;
57}
58

After…lines 1–47 unchanged (47 lines)
48
49.SuspenseScrubberBeadSelected {
50  height: 1rem;
51  background: var(--color-background-selected);
52}
53
54.SuspenseScrubberStepHighlight > .SuspenseScrubberBead,
55.SuspenseScrubberStepHighlight > .SuspenseScrubberBeadSelected,
56.SuspenseScrubberStep:hover > .SuspenseScrubberBead,
57.SuspenseScrubberStep:hover > .SuspenseScrubberBeadSelected {
58  height: 0.75rem;
59}
60

Before…lines 1–46 unchanged (46 lines)
47}
48
49.SuspenseScrubberBeadSelected {
50  height: 1rem;
51  background: var(--color-background-selected);
52}
53
54.SuspenseScrubberStep:hover > .SuspenseScrubberBead,
55.SuspenseScrubberStep:hover > .SuspenseScrubberBeadSelected {
56  height: 0.75rem;
57}
58

After…lines 1–47 unchanged (47 lines)
48
49.SuspenseScrubberBeadSelected {
50  height: 1rem;
51  background: var(--color-background-selected);
52}
53
54.SuspenseScrubberStepHighlight > .SuspenseScrubberBead,
55.SuspenseScrubberStepHighlight > .SuspenseScrubberBeadSelected,
56.SuspenseScrubberStep:hover > .SuspenseScrubberBead,
57.SuspenseScrubberStep:hover > .SuspenseScrubberBeadSelected {
58  height: 0.75rem;
59}
60

Before

stylesheet

rule_set (+53 nodes collapsed)

rule_set (+36 nodes collapsed)

rule_set

selectors

pseudo_class_selector

class_selector

. "."

class_name

identifier "SuspenseScrubberInput"

: ":"

class_name

identifier "focus"

block

{ "{"

declaration

property_name "outline"

: ":"

plain_value "none"

; ";"

} "}"

rule_set (+42 nodes collapsed)

rule_set

selectors

pseudo_class_selector

class_selector

. "."

class_name

identifier "SuspenseScrubberStep"

: ":"

class_name

identifier "last-child"

block

{ "{"

declaration

property_name "padding-right"

: ":"

integer_value "0"

; ";"

} "}"

rule_set (+59 nodes collapsed)

rule_set (+25 nodes collapsed)

rule_set

selectors

child_selector

pseudo_class_selector

class_selector

. "."

class_name

identifier "SuspenseScrubberStep"

: ":"

class_name

identifier "hover"

> ">"

class_selector

. "."

class_name

identifier "SuspenseScrubberBead"

, ","

child_selector

pseudo_class_selector

class_selector

. "."

class_name

identifier "SuspenseScrubberStep"

: ":"

class_name

identifier "hover"

> ">"

class_selector

. "."

class_name

identifier "SuspenseScrubberBeadSelected"

block

{ "{"

declaration

property_name "height"

: ":"

float_value

unit "rem"

; ";"

} "}"

After

stylesheet

rule_set (+53 nodes collapsed)

rule_set (+36 nodes collapsed)

rule_set

selectors

pseudo_class_selector

class_selector

. "."

class_name

identifier "SuspenseScrubberInput"

: ":"

class_name

identifier "focus"

block

{ "{"

declaration

property_name "outline"

: ":"

plain_value "none"

; ";"

} "}"

rule_set (+42 nodes collapsed)

rule_set

selectors

pseudo_class_selector

class_selector

. "."

class_name

identifier "SuspenseScrubberStep"

: ":"

class_name

identifier "last-child"

block

{ "{"

declaration

property_name "padding-right"

: ":"

integer_value "0"

; ";"

} "}"

rule_set (+59 nodes collapsed)

rule_set (+25 nodes collapsed)

rule_set

selectors

child_selector

class_selector

. "."

class_name

identifier "SuspenseScrubberStepHighlight"

> ">"

class_selector

. "."

class_name

identifier "SuspenseScrubberBead"

, ","

child_selector

class_selector

. "."

class_name

identifier "SuspenseScrubberStepHighlight"

> ">"

class_selector

. "."

class_name

identifier "SuspenseScrubberBeadSelected"

, ","

child_selector

pseudo_class_selector

class_selector

. "."

class_name

identifier "SuspenseScrubberStep"

: ":"

class_name

identifier "hover"

> ">"

class_selector

. "."

class_name

identifier "SuspenseScrubberBead"

, ","

child_selector

pseudo_class_selector

class_selector

. "."

class_name

identifier "SuspenseScrubberStep"

: ":"

class_name

identifier "hover"

> ">"

class_selector

. "."

class_name

identifier "SuspenseScrubberBeadSelected"

block

{ "{"

declaration

property_name "height"

: ":"

float_value

unit "rem"

; ";"

} "}"

Keybindings

j / k: next / previous visible node (tree panels)
h / l: collapse / expand the focused node
g / G: jump to first / last visible node
Tab: switch focus between Before/After panels
/: search: jump to next node whose text contains a given string
a: jump the other panel to this node's mapped counterpart
i: hide identical matches, showing only inserted/deleted/updated nodes and their ancestors
v: cycle the view: split / code only / tree only
p: cycle what the code view renders: the node mapping, then each human painting
r: mark this fixture as reviewed, or forget the mark (kept in this browser only)
n: open a random fixture not yet marked as reviewed
?: toggle this help