Dashboard: Remove use of z-index for ring overlay; use DOM ordering
authordbates@webkit.org <dbates@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 8 Sep 2015 15:58:33 +0000 (15:58 +0000)
committerdbates@webkit.org <dbates@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 8 Sep 2015 15:58:33 +0000 (15:58 +0000)
https://bugs.webkit.org/show_bug.cgi?id=148921

Reviewed by Alexey Proskuryakov.

The ring image is positioned above the platform icon in markup and we specify the CSS
property z-index for the ring image so that it is painted on top of the platform icon
instead of below it (by DOM ordering). Instead we can take advantage of the transparency
of the ring image, switch the order of these DOM elements and remove the use of the CSS
property z-index to achieve a similar effect.

* BuildSlaveSupport/build.webkit.org-config/public_html/dashboard/Scripts/Main.js:
(documentReady): Create the platform icon image element before the ring image such that
the ring image is painted on top of the platform icon.
* BuildSlaveSupport/build.webkit.org-config/public_html/dashboard/Styles/Main.css:
(table.queue-grid td.logo img.ring): Removed property z-index.

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

Tools/BuildSlaveSupport/build.webkit.org-config/public_html/dashboard/Scripts/Main.js
Tools/BuildSlaveSupport/build.webkit.org-config/public_html/dashboard/Styles/Main.css
Tools/ChangeLog

index 965b626..4960bd5 100644 (file)
@@ -200,15 +200,15 @@ function documentReady()
         var cell = document.createElement("td");
         cell.classList.add("logo");
 
+        var logoImage = document.createElement("img");
+        logoImage.classList.add("logo");
+        cell.appendChild(logoImage);
+
         var ringImage = document.createElement("img");
         ringImage.classList.add("ring");
         ringImage.title = platform.readableName;
         cell.appendChild(ringImage);
 
-        var logoImage = document.createElement("img");
-        logoImage.classList.add("logo");
-        cell.appendChild(logoImage);
-
         var hideButton = document.createElement("div");
         hideButton.addEventListener("click", function (platformName) { return function () { settings.toggleHiddenPlatform(platformName); }; }(platform.name) );
         hideButton.textContent = "hide";
index ca9d76e..b062ae9 100644 (file)
@@ -1,5 +1,24 @@
 2015-09-08  Daniel Bates  <dabates@apple.com>
 
+        Dashboard: Remove use of z-index for ring overlay; use DOM ordering
+        https://bugs.webkit.org/show_bug.cgi?id=148921
+
+        Reviewed by Alexey Proskuryakov.
+
+        The ring image is positioned above the platform icon in markup and we specify the CSS
+        property z-index for the ring image so that it is painted on top of the platform icon
+        instead of below it (by DOM ordering). Instead we can take advantage of the transparency
+        of the ring image, switch the order of these DOM elements and remove the use of the CSS
+        property z-index to achieve a similar effect.
+
+        * BuildSlaveSupport/build.webkit.org-config/public_html/dashboard/Scripts/Main.js:
+        (documentReady): Create the platform icon image element before the ring image such that
+        the ring image is painted on top of the platform icon.
+        * BuildSlaveSupport/build.webkit.org-config/public_html/dashboard/Styles/Main.css:
+        (table.queue-grid td.logo img.ring): Removed property z-index.
+
+2015-09-08  Daniel Bates  <dabates@apple.com>
+
         Dashboard: Remove duplicate gear icon data URLs
         https://bugs.webkit.org/show_bug.cgi?id=148920