Print Preview component extension

chrome/browser/resources/print_preview/print_preview.css

Index: chrome/browser/resources/print_preview/print_preview.css
diff --git a/chrome/browser/resources/print_preview/print_preview.css b/chrome/browser/resources/print_preview/print_preview.css
new file mode 100644
index 0000000000000000000000000000000000000000..e17b3d228dbe2357e38ad2bfc6e9e3f74e133def
--- /dev/null
+++ b/chrome/browser/resources/print_preview/print_preview.css
@@ -0,0 +1,139 @@
+body {
+  background: #cccccc;
+  font-family: Helvetica;
+  font-size: 84%;
+  margin: 0;
+  overflow: hidden;
+}
+
+hr {
+  background: -webkit-gradient(linear, 0 0, 96% 0, from(rgba(0, 0, 0, .10)),
+                               to(rgba(0, 0, 0, .02)));
+  border: 0;
+  height: 1px;
+  margin: 8px 0;
+}
+
+/* Layout */
+
+.bar.left {
+  width:290px;
+  background:white;
+  -webkit-background-clip:padding-box;
+  border-width:0 10px 0 0;
+  -webkit-border-image: -webkit-gradient(linear, left top, right top, from(rgb(64,64,64)), to(rgba(255,255,255,0))) 0 100% 0 0 repeat repeat;
+}
+
+.page-layout img{
+  max-width:90%;
+  max-height:90%;
+}
+.page-layout {
+  -webkit-box-flex:1;
+  text-align:center;
+  display:-webkit-box;
+  -webkit-box-orient:vertical;
+  -webkit-box-pack:center;
+  padding:auto;
+}
+
+list#preview {
+  height:100%;
+  width:100%;
+  text-align:center;
+}
+
+.placeholder {
+  -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, .50);
+  background: #ffffff;
+  margin:auto;
+}
+
+list .placeholder {
+  margin:5px;
+  height: 110px;
+  width: 85px;
+}
+
+.preview-list-container {
+  -webkit-box-flex:0;
+  width:130px;
+  height:100%;
+  background: -webkit-gradient(linear, right top, left top, from(rgb(90,96,106)), to(rgba(255,255,255,0)));
+}
+
+/* Options */
+
+.main-options {
+  padding:6px;
+  /*
+  background:url('printer.png') top left no-repeat;
+  background-attachment:fixed;
+  background-position:6px 6px; 
+  padding-left:80px;
+  */
+  
+  height:115px;
+}
+
+.main-options * {
+  margin: 2px;
+}
+.main-options button {
+  margin-bottom: 4px;
+}
+
+#more-options {
+  padding:6px;
+  background:rgb(248,250,253);
+  border-top:1px solid rgb(218,223,234);
+  height: 100%;
+}
+
+#more-options-toggle {
+  font-size:80%;
+  color:blue;
+  margin: 5px 5px;
+}
+
+#hidden-options {
+  overflow: hidden;
+  height:auto;
+  -webkit-transition: height .2s linear;
+}
+
+#hidden-options.closed {
+  height:0;
+}
+
+.printer-option {
+  margin-top:3px;
+}
+
+#printer-chooser {
+  text-align: left;
+  width: 200px;
+}
+
+#printer-menu > button {
+  height: 30px;
+}
+
+#printer-menu > .online {
+  background-image: url('images/available.png');
+}
+
+#printer-menu > .offline {
+  background-image: url('images/unavailable.png');
+}
+
+#printer-menu > .online, #printer-menu > .offline {
+  padding-left: 20px;
+  background-repeat: no-repeat;
+  background-position: center left;
+}
+
+#printer-menu .subtitle {
+  font-size:10px;
+  color:gray;
+}