From e037845d50f382c3392a05493bd0982381128924 Mon Sep 17 00:00:00 2001
From: "pfeldman@chromium.org"
 <pfeldman@chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Date: Fri, 24 Feb 2012 07:28:39 +0000
Subject: [PATCH] Web Inspector: make color review larger in the color picker.
 https://bugs.webkit.org/show_bug.cgi?id=79339

Reviewed by Vsevolod Vlasov.

* inspector/front-end/Popover.js:
(WebInspector.Popover.prototype.hide):
* inspector/front-end/Spectrum.js:
* inspector/front-end/elementsPanel.css:
(.spectrum-container):
(.spectrum-color):
(.spectrum-display-value):
(.spectrum-hue):
(.spectrum-fill):
(.spectrum-range-container label):
(.spectrum-range-container input):
(.spectrum-slider):
(.spectrum-container .swatch):
* inspector/front-end/inspector.css:
(.swatch):


git-svn-id: http://svn.webkit.org/repository/webkit/trunk@108734 268f45cc-cd09-0410-ab3c-d52691b4dbfc
---
 Source/WebCore/ChangeLog                           |  23 ++++++++++++++
 Source/WebCore/English.lproj/localizedStrings.js   | Bin 78666 -> 78584 bytes
 Source/WebCore/inspector/front-end/Spectrum.js     |   2 +-
 .../WebCore/inspector/front-end/elementsPanel.css  |  34 ++++++++++++++-------
 Source/WebCore/inspector/front-end/inspector.css   |   3 +-
 5 files changed, 48 insertions(+), 14 deletions(-)

diff --git a/Source/WebCore/ChangeLog b/Source/WebCore/ChangeLog
index 360f0a6..e2c94e5 100644
--- a/Source/WebCore/ChangeLog
+++ b/Source/WebCore/ChangeLog
@@ -1,3 +1,26 @@
+2012-02-23  Pavel Feldman  <pfeldman@chromium.org>
+
+        Web Inspector: make color review larger in the color picker.
+        https://bugs.webkit.org/show_bug.cgi?id=79339
+
+        Reviewed by Vsevolod Vlasov.
+
+        * inspector/front-end/Popover.js:
+        (WebInspector.Popover.prototype.hide):
+        * inspector/front-end/Spectrum.js:
+        * inspector/front-end/elementsPanel.css:
+        (.spectrum-container):
+        (.spectrum-color):
+        (.spectrum-display-value):
+        (.spectrum-hue):
+        (.spectrum-fill):
+        (.spectrum-range-container label):
+        (.spectrum-range-container input):
+        (.spectrum-slider):
+        (.spectrum-container .swatch):
+        * inspector/front-end/inspector.css:
+        (.swatch):
+
 2012-02-23  Kenichi Ishibashi  <bashi@chromium.org>
 
         [Chromium] Add HarfBuzzShaperBase class
diff --git a/Source/WebCore/English.lproj/localizedStrings.js b/Source/WebCore/English.lproj/localizedStrings.js
index 6dcbfa8664549ae5d191c176a3e88b950d5003ef..cadf49ee2e934a79e51fc0f2e9a212146e9b61ed 100644
GIT binary patch
delta 18
acmX^0jOE8umJR6&%{vvg?^Ix%C<Fjo+z4F&

delta 58
zcmezIl;zYjmJR6&%83j)3<V4s42cX@3<?ZN46#7c7R-XnOn#80-<+<nJzaruq7VS$
CrVnHQ

diff --git a/Source/WebCore/inspector/front-end/Spectrum.js b/Source/WebCore/inspector/front-end/Spectrum.js
index 78c04af..3f9a58e 100644
--- a/Source/WebCore/inspector/front-end/Spectrum.js
+++ b/Source/WebCore/inspector/front-end/Spectrum.js
@@ -51,7 +51,7 @@ WebInspector.Spectrum = function()
 
     var rangeContainer = this._containerElement.createChild("div", "spectrum-range-container");
     var alphaLabel = rangeContainer.createChild("label");
-    alphaLabel.textContent = WebInspector.UIString("alpha: ");
+    alphaLabel.textContent = WebInspector.UIString("\u03B1:");
 
     this._alphaElement = rangeContainer.createChild("input", "spectrum-range");
     this._alphaElement.setAttribute("type", "range");
diff --git a/Source/WebCore/inspector/front-end/elementsPanel.css b/Source/WebCore/inspector/front-end/elementsPanel.css
index 11a99d7..8f9224a 100644
--- a/Source/WebCore/inspector/front-end/elementsPanel.css
+++ b/Source/WebCore/inspector/front-end/elementsPanel.css
@@ -536,7 +536,7 @@
     background: rgba(230, 230, 230, 1) !important;
     border: 1px solid #646464;
     padding: 10px;
-    width: 210px;
+    width: 220px;
     z-index: 10;
     -webkit-user-select: none;
 }
@@ -552,11 +552,14 @@
     top: 0;
     left: 0;
     bottom: 0;
-    right: 20%;
+    right: 40px;
 }
 
 .spectrum-display-value {
     -webkit-user-select: text;
+    position: relative;
+    left: 2px;
+    top: -6px;
 }
 
 .spectrum-hue {
@@ -564,12 +567,13 @@
     top: 0;
     right: 0;
     bottom: 0;
-    left: 83%;
+    left: 170px;
+    -webkit-box-reflect: right -28px;
 }
 
 .spectrum-fill {
     /* Same as spectrum-color width to force aspect ratio. */
-    margin-top: 80%;
+    margin-top: 150px;
 }
 
 .spectrum-range-container {
@@ -583,12 +587,15 @@
 }
 
 .spectrum-range-container label {
-    width: 32px;
     display: inline-block;
+    padding-right: 4px;
 }
 
 .spectrum-range-container input {
-    width: 130px;
+    position: absolute;
+    left: 15px;
+    right: 40px;
+    margin: 3px 0 0 0;
 }
 
 .swatch, .spectrum-dragger, .spectrum-slider {
@@ -623,9 +630,14 @@
     position: absolute;
     top: 0;
     cursor: pointer;
-    height: 5px;
-    width: 110%;
-    margin-left: -5%;
-    background: white;
-    opacity: .8;
+    border: 1px solid black;
+    height: 4px;
+    left: -1px;
+    right: -1px;
+}
+
+.spectrum-container .swatch {
+    width: 20px;
+    height:20px;
+    margin: 0;
 }
diff --git a/Source/WebCore/inspector/front-end/inspector.css b/Source/WebCore/inspector/front-end/inspector.css
index c5cb07c..490c1f5 100644
--- a/Source/WebCore/inspector/front-end/inspector.css
+++ b/Source/WebCore/inspector/front-end/inspector.css
@@ -1437,8 +1437,6 @@ li.editing .swatch, li.editing .enabled-button,  li.editing-sub-part .delete-but
 }
 
 .swatch {
-    display: inline-block;
-    vertical-align: baseline;
     margin-left: 1px;
     margin-right: 2px;
     margin-bottom: -1px;
@@ -1446,6 +1444,7 @@ li.editing .swatch, li.editing .enabled-button,  li.editing-sub-part .delete-but
     height: 1em;
     border: 1px solid rgba(128, 128, 128, 0.6);
     background-image: url(Images/checker.png);
+    display: inline-block;
 }
 
 .swatch-inner {
-- 
2.7.4