color: inherit !important;
}
-.variable-or-property > .title > .value {
- -moz-box-flex: 1;
-}
-
.variable-or-property > .title > .arrow {
-moz-margin-start: 3px;
}
.variable-or-property-non-writable-icon {
background: url("chrome://browser/skin/devtools/vview-lock.png") no-repeat;
+ background-size: cover;
width: 16px;
height: 16px;
opacity: 0.5;
@media (min-resolution: 2dppx) {
.variable-or-property-non-writable-icon > .title:after {
background-image: url("chrome://browser/skin/devtools/vview-lock@2x.png");
- background-size: 32px;
}
}
.variable-or-property-frozen-label,
.variable-or-property-sealed-label,
.variable-or-property-non-extensible-label {
+ height: 16px;
-moz-padding-end: 4px;
}
/* Actions first */
+.variables-view-open-inspector {
+ -moz-box-ordinal-group: 1;
+}
+
+.variables-view-edit,
+.variables-view-add-property {
+ -moz-box-ordinal-group: 2;
+}
+
+.variable-or-property-frozen-label,
+.variable-or-property-sealed-label,
+.variable-or-property-non-extensible-label,
+.variable-or-property-non-writable-icon {
+ -moz-box-ordinal-group: 3;
+}
+
+.variables-view-delete {
+ -moz-box-ordinal-group: 4;
+}
+
.variables-view-container[actions-first] .variables-view-delete,
-.variables-view-container[actions-first] .variables-view-open-inspector,
-.variables-view-container[actions-first] .variables-view-add-property {
+.variables-view-container[actions-first] .variables-view-add-property,
+.variables-view-container[actions-first] .variables-view-open-inspector {
-moz-box-ordinal-group: 0;
}
/* Variables and properties editing */
.variables-view-delete {
- list-style-image: url("chrome://browser/skin/devtools/vview-delete.png");
- -moz-image-region: rect(0,16px,16px,0);
+ background: url("chrome://browser/skin/devtools/vview-delete.png");
+ background-size: cover;
+ width: 16px;
+ height: 16px;
+}
+
+@media (min-resolution: 2dppx) {
+ .variables-view-delete {
+ background-image: url("chrome://browser/skin/devtools/vview-delete@2x.png");
+ }
}
.variables-view-delete:hover {
- -moz-image-region: rect(0,48px,16px,32px);
+ background-position: 32px;
}
.variables-view-delete:active {
- -moz-image-region: rect(0,32px,16px,16px);
+ background-position: 16px;
}
-.variable-or-property:focus .variables-view-delete {
-/* -moz-image-region: rect(0,16px,16px,0); */
+.variable-or-property:focus > .title > .variables-view-delete {
+/* background-position: 0px; */
}
.variables-view-edit {
- list-style-image: url("chrome://browser/skin/devtools/vview-edit.png");
- -moz-image-region: rect(0,16px,16px,0);
+ background: url("chrome://browser/skin/devtools/vview-edit.png");
+ background-size: cover;
+ width: 16px;
+ height: 16px;
cursor: pointer;
- padding-left: 2px;
+}
+
+@media (min-resolution: 2dppx) {
+ .variables-view-edit {
+ background-image: url("chrome://browser/skin/devtools/vview-edit@2x.png");
+ }
}
.variables-view-edit:hover {
- -moz-image-region: rect(0,48px,16px,32px);
+ background-position: 32px;
}
.variables-view-edit:active {
- -moz-image-region: rect(0,32px,16px,16px);
+ background-position: 16px;
}
-.variable-or-property:focus .variables-view-edit {
-/* -moz-image-region: rect(0,16px,16px,0); */
+.variable-or-property:focus > .title > .variables-view-edit {
+/* background-position: 0px; */
}
.variables-view-open-inspector {
- list-style-image: url("chrome://browser/skin/devtools/vview-open-inspector.png");
- -moz-image-region: rect(0,16px,16px,0);
+ background: url("chrome://browser/skin/devtools/vview-open-inspector.png");
+ background-size: cover;
+ width: 16px;
+ height: 16px;
cursor: pointer;
}
.variables-view-open-inspector:hover {
- -moz-image-region: rect(0,48px,16px,32px);
+ background-position: 32px;
}
.variables-view-open-inspector:active {
- -moz-image-region: rect(0,32px,16px,16px);
+ background-position: 16px;
}
-.variable-or-property:focus .variables-view-open-inspector {
-/* -moz-image-region: rect(0,16px,16px,0); */
+.variable-or-property:focus > .title > .variables-view-open-inspector {
+/* background-position: 0px; */
}
-.variables-view-throbber {
- background: url("chrome://global/skin/icons/loading_16.png") center no-repeat;
- width: 16px;
- height: 16px;
-}
+/* Variables and properties input boxes */
-.element-value-input {
+.variable-or-property > .title > .separator + .element-value-input {
-moz-margin-start: -2px !important;
-moz-margin-end: 2px !important;
}
+.variable-or-property > .title > .separator[hidden=true] + .element-value-input {
+ -moz-margin-start: 4px !important;
+ -moz-margin-end: 2px !important;
+}
+
.element-name-input {
-moz-margin-start: -2px !important;
-moz-margin-end: 2px !important;