[DevTools] Hide the device frame when the viewport is too narrow to accomodate it.

third_party/WebKit/Source/devtools/front_end/emulation/deviceModeView.css

Index: third_party/WebKit/Source/devtools/front_end/emulation/deviceModeView.css
diff --git a/third_party/WebKit/Source/devtools/front_end/emulation/deviceModeView.css b/third_party/WebKit/Source/devtools/front_end/emulation/deviceModeView.css
index 9613727c2dff631f5c6dcb631bbe93819319ba79..5bef1f5645d094dbc0a71af0b33215138703c6b2 100644
--- a/third_party/WebKit/Source/devtools/front_end/emulation/deviceModeView.css
+++ b/third_party/WebKit/Source/devtools/front_end/emulation/deviceModeView.css
@@ -129,6 +129,14 @@
     height: 100%;
 }
 
+.device-mode-outline-image {
+  visibility: hidden;
+}
+
+.device-mode-outline-image.device-frame-visible {
+  visibility: visible;
+}
+
 .device-mode-outline-image.device-frame-visible + .device-mode-screen-area {
     box-shadow: none;
 }
@@ -334,3 +342,13 @@
     top: -15px;
     transform: rotate(270deg);
 }
+
+@media (max-width : 520px) {
+  .device-mode-outline-image.device-frame-visible {
+    visibility: hidden;
+  }
+
+  .device-mode-outline-image.device-frame-visible + .device-mode-screen-area {
+    box-shadow: hsl(240, 3%, 84%) 0 0 0 0.5px, hsla(0, 0%, 80%, 0.4) 0 0 20px;
+  }
+}