Refactor print preview web ui

chrome/browser/resources/print_preview/previewarea/margin_control.css

Index: chrome/browser/resources/print_preview/previewarea/margin_control.css
diff --git a/chrome/browser/resources/print_preview/previewarea/margin_control.css b/chrome/browser/resources/print_preview/previewarea/margin_control.css
new file mode 100644
index 0000000000000000000000000000000000000000..38c5834b69efc89e0a9922ab1e20d742b4e60ce6
--- /dev/null
+++ b/chrome/browser/resources/print_preview/previewarea/margin_control.css
@@ -0,0 +1,91 @@
+/* Copyright (c) 2012 The Chromium Authors. All rights reserved.
+ * Use of this source code is governed by a BSD-style license that can be
+ * found in the LICENSE file.
+ */
+
+#preview-area .margin-control {
+  -webkit-transition: opacity 150ms linear;
+  position: absolute;
+}
+
+#preview-area .margin-control.invisible {
+  opacity: 0;
+  pointer-events: none;
+}
+
+#preview-area .margin-control.margin-control-top,
+#preview-area .margin-control.margin-control-bottom {
+  cursor: ns-resize;
+  padding: 8px 0;
+  width: 100%;
+}
+
+#preview-area .margin-control.margin-control-left,
+#preview-area .margin-control.margin-control-right {
+  cursor: ew-resize;
+  height: 100%;
+  padding: 0 8px;
+}
+
+#preview-area .margin-control.margin-control-disabled {
+  cursor: default;
+}
+
+#preview-area .margin-control-line {
+  border-color: rgb(64, 128, 250);
+  border-style: dashed;
+  border-width: 1px;
+}
+
+#preview-area .margin-control-disabled .margin-control-line  {
+  border-color: gray;
+}
+
+#preview-area .margin-control-top .margin-control-line,
+#preview-area .margin-control-bottom .margin-control-line {
+  width: 100%;
+}
+
+#preview-area .margin-control-left .margin-control-line,
+#preview-area .margin-control-right .margin-control-line {
+  height: 100%;
+}
+
+#preview-area .margin-control-textbox {
+  background-color: #2a2a2a;
+  border: 1px solid #888;
+  box-sizing: border-box;
+  color: white;
+  cursor: auto;
+  font-family: arial;
+  font-size: 0.8em;
+  height: 25px;
+  padding: 5px 0;
+  position: absolute;
+  text-align: center;
+  width: 60px;
+}
+
+#preview-area .margin-control-textbox.invalid {
+  background-color: rgb(193, 27, 23);
+}
+
+#preview-area .margin-control-top .margin-control-textbox {
+  left: 50%;
+  top: 8px;
+}
+
+#preview-area .margin-control-right .margin-control-textbox {
+  right: 8px;
+  top: 50%;
+}
+
+#preview-area .margin-control-bottom .margin-control-textbox {
+  bottom: 8px;
+  right: 50%;
+}
+
+#preview-area .margin-control-left .margin-control-textbox {
+  bottom: 50%;
+  left: 8px;
+}