Revert of [DevTools] Device Mode polish.

third_party/WebKit/Source/devtools/front_end/ui/toolbar.css

Index: third_party/WebKit/Source/devtools/front_end/ui/toolbar.css
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/toolbar.css b/third_party/WebKit/Source/devtools/front_end/ui/toolbar.css
index 3d7b2e07701e2e499a78d2362537e70224bed0ed..dc3babb651daebb7035bbc0bdc4116793aff9756 100644
--- a/third_party/WebKit/Source/devtools/front_end/ui/toolbar.css
+++ b/third_party/WebKit/Source/devtools/front_end/ui/toolbar.css
@@ -47,7 +47,116 @@
     color: #5a5a5a;
 }
 
-.toolbar-dropdown-arrow {
+/* Text-glyph item */
+
+.toolbar-text-glyph {
+    white-space: nowrap;
+    overflow: hidden;
+    min-width: 28px;
+    background: transparent;
+}
+
+.toolbar-text {
+    margin: 0 5px;
+    flex: none;
+    color: #5a5a5a;
+}
+
+.toolbar-has-glyph .toolbar-text {
+    margin-left: 0;
+}
+
+.toolbar-bold .toolbar-text {
+    font-weight: bold;
+}
+
+.toolbar-dimmed .toolbar-text {
+    color: #999;
+}
+
+.toolbar-glyph {
+    -webkit-mask-image: url(Images/toolbarButtonGlyphs.png);
+    -webkit-mask-size: 352px 168px;
+    background-color: #5a5a5a;
+    width: 28px;
+    height: 24px;
+    flex: none;
+    transform: translateX(-2px);
+}
+
+@media (-webkit-min-device-pixel-ratio: 1.5) {
+.toolbar-glyph {
+    -webkit-mask-image: url(Images/toolbarButtonGlyphs_2x.png);
+}
+} /* media */
+
+/* Button */
+
+.toolbar-button:disabled .toolbar-glyph {
+    opacity: 0.5;
+}
+
+.toolbar-button:enabled.hover:not(:active) .toolbar-glyph {
+    background-color: #333;
+}
+
+.toolbar-button:enabled.hover:not(:active) .toolbar-text {
+    color: #333;
+}
+
+.toolbar-button.toolbar-state-on .toolbar-glyph,
+.toolbar-blue-on-hover .toolbar-button:not(.toolbar-state-on):enabled.hover:not(:active),
+.-theme-selection-color {
+    background-color: hsl(218, 81%, 59%);
+}
+
+.toolbar-button.toolbar-state-on .toolbar-text,
+.-theme-selection-color {
+    color: hsl(218, 81%, 59%);
+}
+
+.toolbar-blue-on-hover .toolbar-button:not(.toolbar-state-on):enabled.hover .toolbar-glyph {
+    background-color: white;
+}
+
+.toolbar-blue-on-hover .toolbar-button:not(.toolbar-state-on):enabled.hover .toolbar-text {
+    color: white;
+}
+
+.toolbar-button.toolbar-state-on:enabled.hover:not(:active) .toolbar-glyph,
+.toolbar-blue-on-hover .toolbar-button:not(.toolbar-state-on):enabled:active.hover,
+.-theme-selection-color {
+    background-color: hsl(218, 96%, 54%);
+}
+
+.toolbar-button.toolbar-state-on:enabled.hover:not(:active) .toolbar-text,
+.-theme-selection-color {
+    color: hsl(218, 96%, 54%);
+}
+
+.toolbar-toggled-gray .toolbar-button.toolbar-state-on {
+    background-color: #f3f3f3 !important;
+}
+
+/* Checkbox */
+
+.toolbar-item.checkbox {
+    padding: 0 5px 0 2px;
+}
+
+.toolbar-item.checkbox.hover {
+    color: #333;
+}
+
+/* Select */
+
+.toolbar-select-container {
+    display: inline-flex;
+    flex-shrink: 0;
+    margin-right: 6px;
+}
+
+.toolbar-select-arrow {
     -webkit-mask-image: url(Images/toolbarButtonGlyphs.png);
     -webkit-mask-size: 352px 168px;
     -webkit-mask-position: -18px -96px;
@@ -60,123 +169,10 @@
 }
 
 @media (-webkit-min-device-pixel-ratio: 1.5) {
-    .toolbar-dropdown-arrow {
-        -webkit-mask-image: url(Images/toolbarButtonGlyphs_2x.png);
-    }
+.toolbar-select-arrow {
+    -webkit-mask-image: url(Images/toolbarButtonGlyphs_2x.png);
+}
 } /* media */
-
-/* Text-glyph item */
-
-.toolbar-text-glyph {
-    white-space: nowrap;
-    overflow: hidden;
-    min-width: 28px;
-    background: transparent;
-}
-
-.toolbar-text {
-    margin: 0 5px;
-    flex: none;
-    color: #5a5a5a;
-}
-
-.toolbar-has-dropdown .toolbar-text {
-    margin-right: 1px;
-}
-
-.toolbar-has-glyph .toolbar-text {
-    margin-left: 0;
-}
-
-.toolbar-bold .toolbar-text {
-    font-weight: bold;
-}
-
-.toolbar-dimmed .toolbar-text {
-    color: #999;
-}
-
-.toolbar-glyph {
-    -webkit-mask-image: url(Images/toolbarButtonGlyphs.png);
-    -webkit-mask-size: 352px 168px;
-    background-color: #5a5a5a;
-    width: 28px;
-    height: 24px;
-    flex: none;
-    transform: translateX(-2px);
-}
-
-@media (-webkit-min-device-pixel-ratio: 1.5) {
-.toolbar-glyph {
-    -webkit-mask-image: url(Images/toolbarButtonGlyphs_2x.png);
-}
-} /* media */
-
-/* Button */
-
-.toolbar-button:disabled .toolbar-glyph {
-    opacity: 0.5;
-}
-
-.toolbar-button:enabled.hover:not(:active) .toolbar-glyph {
-    background-color: #333;
-}
-
-.toolbar-button:enabled.hover:not(:active) .toolbar-text {
-    color: #333;
-}
-
-.toolbar-button.toolbar-state-on .toolbar-glyph,
-.toolbar-blue-on-hover .toolbar-button:not(.toolbar-state-on):enabled.hover:not(:active),
-.-theme-selection-color {
-    background-color: hsl(218, 81%, 59%);
-}
-
-.toolbar-button.toolbar-state-on .toolbar-text,
-.-theme-selection-color {
-    color: hsl(218, 81%, 59%);
-}
-
-.toolbar-blue-on-hover .toolbar-button:not(.toolbar-state-on):enabled.hover .toolbar-glyph {
-    background-color: white;
-}
-
-.toolbar-blue-on-hover .toolbar-button:not(.toolbar-state-on):enabled.hover .toolbar-text {
-    color: white;
-}
-
-.toolbar-button.toolbar-state-on:enabled.hover:not(:active) .toolbar-glyph,
-.toolbar-blue-on-hover .toolbar-button:not(.toolbar-state-on):enabled:active.hover,
-.-theme-selection-color {
-    background-color: hsl(218, 96%, 54%);
-}
-
-.toolbar-button.toolbar-state-on:enabled.hover:not(:active) .toolbar-text,
-.-theme-selection-color {
-    color: hsl(218, 96%, 54%);
-}
-
-.toolbar-toggled-gray .toolbar-button.toolbar-state-on {
-    background-color: #f3f3f3 !important;
-}
-
-/* Checkbox */
-
-.toolbar-item.checkbox {
-    padding: 0 5px 0 2px;
-}
-
-.toolbar-item.checkbox.hover {
-    color: #333;
-}
-
-/* Select */
-
-.toolbar-select-container {
-    display: inline-flex;
-    flex-shrink: 0;
-    margin-right: 6px;
-}
 
 select.toolbar-item {
     min-width: 48px;