[webkit-changes] [127242] trunk/Source/WebCore

Fri, 31 Aug 2012 02:42:51 -0700

Title: [127242] trunk/Source/WebCore
Revision
127242
Author
[email protected]
Date
2012-08-31 02:43:27 -0700 (Fri, 31 Aug 2012)

Log Message

Web Inspector: Add high-DPI images for status bar glyphs
https://bugs.webkit.org/show_bug.cgi?id=95471

Patch by Patrick Dubroy <[email protected]> on 2012-08-31
Reviewed by Pavel Feldman.

Add the new 2x resolution image for the status bar glyphs, and add
media queries to use the images on high-DPI devices.

* inspector/front-end/Images/statusbarButtonGlyphs2x.png: Added.
* inspector/front-end/WebKit.qrc:
* inspector/front-end/inspector.css:
(.long-click-glyph):
(@media (-webkit-min-device-pixel-ratio: 1.5)):
(.status-bar-item > .glyph):
* inspector/front-end/scriptsPanel.css:
(.toggle-breakpoints .glyph):
(@media (-webkit-min-device-pixel-ratio: 1.5)):
(.status-bar-item.scripts-navigator-show-hide-button > .glyph):
(.status-bar-item.scripts-debugger-show-hide-button > .glyph):
* WebCore.gypi
* inspector/front-end/timelinePanel.css:
(#timeline-overview-sidebar .icon):
(@media (-webkit-min-device-pixel-ratio: 1.5)):

Modified Paths

Added Paths

Diff

Modified: trunk/Source/WebCore/ChangeLog (127241 => 127242)


--- trunk/Source/WebCore/ChangeLog	2012-08-31 09:40:57 UTC (rev 127241)
+++ trunk/Source/WebCore/ChangeLog	2012-08-31 09:43:27 UTC (rev 127242)
@@ -1,3 +1,29 @@
+2012-08-31  Patrick Dubroy  <[email protected]>
+
+        Web Inspector: Add high-DPI images for status bar glyphs
+        https://bugs.webkit.org/show_bug.cgi?id=95471
+
+        Reviewed by Pavel Feldman.
+
+        Add the new 2x resolution image for the status bar glyphs, and add
+        media queries to use the images on high-DPI devices.
+
+        * inspector/front-end/Images/statusbarButtonGlyphs2x.png: Added.
+        * inspector/front-end/WebKit.qrc:
+        * inspector/front-end/inspector.css:
+        (.long-click-glyph):
+        (@media (-webkit-min-device-pixel-ratio: 1.5)):
+        (.status-bar-item > .glyph):
+        * inspector/front-end/scriptsPanel.css:
+        (.toggle-breakpoints .glyph):
+        (@media (-webkit-min-device-pixel-ratio: 1.5)):
+        (.status-bar-item.scripts-navigator-show-hide-button > .glyph):
+        (.status-bar-item.scripts-debugger-show-hide-button > .glyph):
+        * WebCore.gypi
+        * inspector/front-end/timelinePanel.css:
+        (#timeline-overview-sidebar .icon):
+        (@media (-webkit-min-device-pixel-ratio: 1.5)):
+
 2012-08-30  Pavel Feldman  <[email protected]>
 
         Web Inspector: render box model elements and grid on inspector overlay

Modified: trunk/Source/WebCore/WebCore.gypi (127241 => 127242)


--- trunk/Source/WebCore/WebCore.gypi	2012-08-31 09:40:57 UTC (rev 127241)
+++ trunk/Source/WebCore/WebCore.gypi	2012-08-31 09:43:27 UTC (rev 127242)
@@ -6658,6 +6658,7 @@
             'inspector/front-end/Images/splitviewDimple.png',
             'inspector/front-end/Images/splitviewDividerBackground.png',
             'inspector/front-end/Images/statusbarButtonGlyphs.png',
+            'inspector/front-end/Images/statusbarButtonGlyphs2x.png',
             'inspector/front-end/Images/statusbarResizerHorizontal.png',
             'inspector/front-end/Images/statusbarResizerVertical.png',
             'inspector/front-end/Images/successGreenDot.png',

Added: trunk/Source/WebCore/inspector/front-end/Images/statusbarButtonGlyphs2x.png


(Binary files differ)
Property changes on: trunk/Source/WebCore/inspector/front-end/Images/statusbarButtonGlyphs2x.png ___________________________________________________________________

Added: svn:mime-type

Modified: trunk/Source/WebCore/inspector/front-end/WebKit.qrc (127241 => 127242)


--- trunk/Source/WebCore/inspector/front-end/WebKit.qrc	2012-08-31 09:40:57 UTC (rev 127241)
+++ trunk/Source/WebCore/inspector/front-end/WebKit.qrc	2012-08-31 09:43:27 UTC (rev 127242)
@@ -335,6 +335,7 @@
     <file>Images/splitviewDimple.png</file>
     <file>Images/splitviewDividerBackground.png</file>
     <file>Images/statusbarButtonGlyphs.png</file>
+    <file>Images/statusbarButtonGlyphs2x.png</file>
     <file>Images/statusbarResizerHorizontal.png</file>
     <file>Images/statusbarResizerVertical.png</file>
     <file>Images/successGreenDot.png</file>

Modified: trunk/Source/WebCore/inspector/front-end/inspector.css (127241 => 127242)


--- trunk/Source/WebCore/inspector/front-end/inspector.css	2012-08-31 09:40:57 UTC (rev 127241)
+++ trunk/Source/WebCore/inspector/front-end/inspector.css	2012-08-31 09:43:27 UTC (rev 127242)
@@ -611,9 +611,16 @@
     background-color: rgba(0, 0, 0, 0.75);
     -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
     -webkit-mask-position: -288px -48px;
+    -webkit-mask-size: 320px 72px;
     z-index: 1;
 }
 
+@media (-webkit-min-device-pixel-ratio: 1.5) {
+.long-click-glyph {
+    -webkit-mask-image: url(Images/statusbarButtonGlyphs2x.png);
+}
+}
+
 .long-click-glyph.shadow {
     top: 1px;
     background-color: white !important;
@@ -688,8 +695,15 @@
 
 .status-bar-item > .glyph {
     -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
+    -webkit-mask-size: 320px 72px;
 }
 
+@media (-webkit-min-device-pixel-ratio: 1.5) {
+.status-bar-item > .glyph {
+    -webkit-mask-image: url(Images/statusbarButtonGlyphs2x.png);
+}
+}
+
 button.dock-status-bar-item.status-bar-item.toggled-undock .glyph {
     -webkit-mask-position: 0 -48px;
 }

Modified: trunk/Source/WebCore/inspector/front-end/scriptsPanel.css (127241 => 127242)


--- trunk/Source/WebCore/inspector/front-end/scriptsPanel.css	2012-08-31 09:40:57 UTC (rev 127241)
+++ trunk/Source/WebCore/inspector/front-end/scriptsPanel.css	2012-08-31 09:43:27 UTC (rev 127242)
@@ -116,9 +116,16 @@
 .toggle-breakpoints .glyph {
     -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
     -webkit-mask-position: -32px 0;
+    -webkit-mask-size: 320px 72px;
     background-color: rgb(96, 96, 96) !important;
 }
 
+@media (-webkit-min-device-pixel-ratio: 1.5) {
+.toggle-breakpoints .glyph {
+    -webkit-mask-image: url(Images/statusbarButtonGlyphs2x.png);        
+}
+}
+
 .toggle-breakpoints.toggled-on .glyph {
     -webkit-mask-position: 0 -24px;
 }
@@ -157,8 +164,9 @@
 
 .status-bar-item.scripts-navigator-show-hide-button > .glyph {
     background-color: rgba(0, 0, 0, 0.5);
+    -webkit-mask-image: url(Images/navigatorShowHideButton.png);
     -webkit-mask-position: 0 0;
-    -webkit-mask-image: url(Images/navigatorShowHideButton.png);
+    -webkit-mask-size: 48px 32px;
 }
 
 .status-bar-item.scripts-navigator-show-hide-button.toggled-pinned > .glyph {
@@ -271,8 +279,9 @@
 
 .status-bar-item.scripts-debugger-show-hide-button > .glyph {
     background-color: rgba(0, 0, 0, 0.5);
+    -webkit-mask-image: url(Images/navigatorShowHideButton.png);
     -webkit-mask-position: 0 0;
-    -webkit-mask-image: url(Images/navigatorShowHideButton.png);
+    -webkit-mask-size: 48px 32px;
 }
 
 button.status-bar-item.scripts-debugger-show-hide-button.toggled-shown {

Modified: trunk/Source/WebCore/inspector/front-end/timelinePanel.css (127241 => 127242)


--- trunk/Source/WebCore/inspector/front-end/timelinePanel.css	2012-08-31 09:40:57 UTC (rev 127241)
+++ trunk/Source/WebCore/inspector/front-end/timelinePanel.css	2012-08-31 09:43:27 UTC (rev 127242)
@@ -486,9 +486,16 @@
     margin-left: 0;
     margin-right: 0;
     -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
+    -webkit-mask-size: 320px 72px;
     background-color: black;
 }
 
+@media (-webkit-min-device-pixel-ratio: 1.5) {
+#timeline-overview-sidebar .icon {
+    -webkit-mask-image: url(Images/statusbarButtonGlyphs2x.png);
+}
+}
+
 .timeline-overview-sidebar-events .icon {
     -webkit-mask-position: -192px -48px;
 }

_______________________________________________
webkit-changes mailing list
[email protected]
http://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to