1541844 - Increase padding in Rules to 4/8 pixels

Status: NEW

(DevTools :: Inspector: Rules, enhancement, P3)

Description

[Florens Verschelde :fvsch]

Attachment: Test - Rules with 4-8 pixel padding.png

CSS text in Rules is a little bit cramped, with this padding:

.ruleview-rule {
  padding: 2px 4px;
}

Compared to other DevTools panes:

• In Debugger panes we've started using 4px for the top and bottom spacing of most panes, and 20px horizontal padding in many cases
• In Inspector>Layout and Inspector>Fonts we tend to use 20px horizontal padding too.

We want Rules to still fit a lot of content, but I propose changing the padding to:

.ruleview-rule {
-  padding: 2px 4px;
+  padding: 4px 8px;
}

(padding: 4px 6px; might work too.)