1 files changed, 138 insertions, 0 deletions
diff --git a/vendor/assets/stylesheets/peek.scss b/vendor/assets/stylesheets/peek.scss
new file mode 100644
index 00000000000..4b2957c5575
--- /dev/null
+++ b/vendor/assets/stylesheets/peek.scss
@@ -0,0 +1,138 @@
+//= require peek/views/performance_bar
+//= require peek/views/rblineprof
+//= require peek/views/rblineprof/pygments
+
+#peek {
+  background: #000;
+  height: 35px;
+  line-height: 35px;
+  color: #999;
+  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75);
+
+  .hidden {
+    display: none;
+    visibility: visible;
+  }
+
+  &.disabled {
+    display: none;
+  }
+
+  &.production {
+    background-color: #222;
+  }
+
+  &.staging {
+    background-color: #291430;
+  }
+
+  &.development {
+    background-color: #4c1210;
+  }
+
+  .wrapper {
+    width: 800px;
+    margin: 0 auto;
+  }
+
+  // UI Elements
+  .bucket {
+    background: #111;
+    display: inline-block;
+    padding: 4px 6px;
+    font-family: Consolas, "Liberation Mono", Courier, monospace;
+    line-height: 1;
+    color: #ccc;
+    border-radius: 3px;
+    box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 1px 2px rgba(0,0,0,.25);
+
+    .hidden {
+      display: none;
+    }
+
+    &:hover .hidden {
+      display: inline;
+    }
+  }
+
+  strong {
+    color: #fff;
+  }
+
+  .view {
+    margin-right: 15px;
+    float: left;
+
+    &:last-child {
+      margin-right: 0;
+    }
+  }
+
+  .css-truncate {
+    &.css-truncate-target,
+    .css-truncate-target {
+      display: inline-block;
+      max-width: 125px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      vertical-align: top;
+    }
+
+    &.expandable:hover .css-truncate-target,
+    &.expandable:hover.css-truncate-target {
+      max-width: 10000px !important;
+    }
+  }
+}
+
+// .performance-bar {
+//   position: relative;
+//   top: 2px;
+//   display: inline-block;
+//   width: 75px;
+//   height: 10px;
+//   margin: 0 0 0 5px;
+//   list-style: none;
+//   background-color: rgba(0, 0, 0, .5);
+//   border: 1px solid rgba(0, 0, 0, .7);
+//   border-radius: 2px;
+//   box-shadow: 0 1px 0 rgba(255, 255, 255, .15);
+//
+//   li {
+//     position: absolute;
+//     top: 0;
+//     bottom: 0;
+//     overflow: hidden;
+//     opacity: .8;
+//     color: transparent;
+//
+//     &:hover {
+//       opacity: 1;
+//       cursor: default;
+//     }
+//   }
+// }
+
+.tipsy { font-size: 10px; position: absolute; padding: 5px; z-index: 100000; }
+  .tipsy-inner { background-color: #000; color: #FFF; max-width: 200px; padding: 5px 8px 4px 8px; text-align: center; }
+
+  /* Rounded corners */
+  .tipsy-inner { border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
+
+  .tipsy-arrow { position: absolute; width: 0; height: 0; line-height: 0; border: 5px dashed #000; }
+
+  /* Rules to colour arrows */
+  .tipsy-arrow-n { border-bottom-color: #000; }
+  .tipsy-arrow-s { border-top-color: #000; }
+  .tipsy-arrow-e { border-left-color: #000; }
+  .tipsy-arrow-w { border-right-color: #000; }
+
+  .tipsy-n .tipsy-arrow { top: 0px; left: 50%; margin-left: -5px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent; }
+    .tipsy-nw .tipsy-arrow { top: 0; left: 10px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent;}
+    .tipsy-ne .tipsy-arrow { top: 0; right: 10px; border-bottom-style: solid; border-top: none;  border-left-color: transparent; border-right-color: transparent;}
+  .tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -5px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
+    .tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
+    .tipsy-se .tipsy-arrow { bottom: 0; right: 10px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; }
+  .tipsy-e .tipsy-arrow { right: 0; top: 50%; margin-top: -5px; border-left-style: solid; border-right: none; border-top-color: transparent; border-bottom-color: transparent; }
+  .tipsy-w .tipsy-arrow { left: 0; top: 50%; margin-top: -5px; border-right-style: solid; border-left: none; border-top-color: transparent; border-bottom-color: transparent; }