From ccd060f179cdeb981748ab58187b3f4cbc72b0aa Mon Sep 17 00:00:00 2001
From: Alex P <thealexpaxton@gmail.com>
Date: Fri, 4 May 2018 11:25:26 -0700
Subject: [PATCH] Introduce stylesheet for IFQL schema explorer

---
 .../time-machine/ifql-explorer.scss           | 49 +++++++++++++++++++
 1 file changed, 49 insertions(+)
 create mode 100644 ui/src/style/components/time-machine/ifql-explorer.scss

diff --git a/ui/src/style/components/time-machine/ifql-explorer.scss b/ui/src/style/components/time-machine/ifql-explorer.scss
new file mode 100644
index 0000000000..05ae155ef8
--- /dev/null
+++ b/ui/src/style/components/time-machine/ifql-explorer.scss
@@ -0,0 +1,49 @@
+/*
+    IFQL Schema Explorer -- Tree View
+    ----------------------------------------------------------------------------
+*/
+
+$ifql-tree-indent: 30px;
+
+.ifql-schema-explorer {
+  width: 100%;
+  height: 100%;
+}
+
+.ifql-schema-tree {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+
+  & > .ifql-schema-tree {
+    padding-left: $ifql-tree-indent;
+  }
+
+  .ifql-schema-item + & {
+    display: none;
+  }
+
+  .expanded .ifql-schema-item + & {
+    display: flex;
+  }
+}
+
+.ifql-schema-item {
+  position: relative;
+  height: 30px;
+  display: flex;
+  align-items: center;
+  padding: 0 11px;
+  padding-left: 32px;
+
+  > span {
+    position: absolute;
+    top: 50%;
+    left: 14px;
+    transform: translate(-50%, -50%);
+    transition: transform 0.25s ease;
+  }
+  
+}
+
+