Web Inspector: Make prototype pill’s background semi-transparent
authornvasilyev@apple.com <nvasilyev@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Sun, 19 Apr 2015 04:19:54 +0000 (04:19 +0000)
committernvasilyev@apple.com <nvasilyev@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Sun, 19 Apr 2015 04:19:54 +0000 (04:19 +0000)
https://bugs.webkit.org/show_bug.cgi?id=143928

Reviewed by Timothy Hatcher.

* UserInterface/Views/ObjectTreePropertyTreeElement.css:
(.object-tree-property.prototype-property):

(.object-tree-property.prototype-property:hover, .object-tree-property.prototype-property:focus):
Slightly highlight the prototype pill when hovering over.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@182989 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/ObjectTreePropertyTreeElement.css

index 993e7c7..81f525d 100644 (file)
@@ -1,3 +1,16 @@
+2015-04-18  Nikita Vasilyev  <nvasilyev@apple.com>
+
+        Web Inspector: Make prototype pill’s background semi-transparent
+        https://bugs.webkit.org/show_bug.cgi?id=143928
+
+        Reviewed by Timothy Hatcher.
+
+        * UserInterface/Views/ObjectTreePropertyTreeElement.css:
+        (.object-tree-property.prototype-property):
+
+        (.object-tree-property.prototype-property:hover, .object-tree-property.prototype-property:focus):
+        Slightly highlight the prototype pill when hovering over.
+
 2015-04-17  Jono Wells  <jonowells@apple.com>
 
         Web Inspector: All sans-serif font family rules should be set the same way.
index cde454c..f5ae492 100644 (file)
 .object-tree-property.prototype-property {
     display: inline-block;
 
-    border: 1px solid rgb(222, 222, 222);
-    background-color: rgb(242, 242, 242);
+    border: 1px solid hsla(0, 0%, 0%, 0.06);
+    background-color: hsla(0, 0%, 0%, 0.03);
     border-radius: 3px;
 
     padding: 0 10px 1px 0;
     margin: 3px 0 2px 0;
 }
 
+.object-tree-property.prototype-property:hover, .object-tree-property.prototype-property:focus {
+    border-color: hsla(0, 0%, 0%, 0.1);
+}
+
 .object-tree-property.prototype-property > .icon {
     display: none;
 }