DevTools: make responsive design a master switch for emulation.

Source/devtools/front_end/overrides.css

 /*
  * Copyright (C) 2013 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 48 matching lines @@
 
 .overrides-view .tabbed-pane-header-tab {
     background-color: transparent;
     border: none transparent;
     font-weight: normal;
     text-shadow: none;
     color: #777;
     height: 22px;
     padding-left: 0;
     padding-left: 10px;
-    border-left: 6px solid transparent;
+    border-left: 8px solid transparent;
 }
 
 .overrides-view .tabbed-pane-header-tab:not(.selected) {
     cursor: pointer !important;
 }
 
 .overrides-view .tabbed-pane-header-tab.selected {
     color: inherit;
     border: none transparent;
-    border-left: 6px solid #666;
+    border-left: 8px solid #666;
 }
 
 .overrides-view fieldset {
     border: none;
     padding: 0 0 5px 15px;
 }
 
 .overrides-view fieldset p {
     display: inline-block;
     padding: 0;
@@ skipping 96 matching lines @@
     padding: 12px;
 }
 
 .overrides-view label {
     display: flex;
     height: auto;
 }
 
 /* Screen tab */
 
-.overrides-viewport > label {
+.overrides-media > label {
     margin-bottom: 4px;
 }
 
 /* Sensors tab */
 
 .overrides-sensors > label {
     margin-bottom: 10px;
 }
 
-.overrides-device, .overrides-viewport, .overrides-network, .overrides-sensors {
+.overrides-device, .overrides-media, .overrides-network, .overrides-sensors {
     flex: none !important;
 }
 
 .overrides-sensors input {
     text-align: right;
 }
 
 .overrides-activate-device #tab-device,
-.overrides-activate-viewport #tab-viewport,
+.overrides-activate-media #tab-viewport,
 .overrides-activate-network #tab-network,
 .overrides-activate-sensors #tab-sensors {
-    color: rgb(25, 100, 228);
     opacity: 0.8;
 }
 
+.overrides-activate-device #tab-device .tabbed-pane-header-tab-title::after,
+.overrides-activate-media #tab-viewport .tabbed-pane-header-tab-title::after,
+.overrides-activate-network #tab-network .tabbed-pane-header-tab-title::after,
+.overrides-activate-sensors #tab-sensors .tabbed-pane-header-tab-title::after {
+    padding-left: 3px;
+    content: "\2713";
+    color: rgb(25, 100, 228);
+}
+
 .overrides-activate-device #tab-device.selected,
-.overrides-activate-viewport #tab-viewport.selected,
+.overrides-activate-media #tab-viewport.selected,
 .overrides-activate-network #tab-network.selected,
 .overrides-activate-sensors #tab-sensors.selected {
     opacity: 1;
 }
 
 .overrides-view input[type=text]:enabled:focus,
 .overrides-view select:enabled:focus {
     -webkit-transition: border-color 200ms;
     border-color: rgb(77, 144, 254);
     outline: none;
@@ skipping 41 matching lines @@
 
 @media (-webkit-min-device-pixel-ratio: 1.5) {
 .overrides-view .overrides-footer::before {
     background-image: url(Images/statusbarButtonGlyphs_2x.png);
 }
 } /* media */
 
 .overrides-view .overrides-footer .warning-icon-small {
     margin-right: 3px;
 }