From c6a3faf616e68ede2d67580344e4337c3f0cfdc5 Mon Sep 17 00:00:00 2001
From: Jude <julie_wang1@brown.edu>
Date: Sat, 9 Mar 2019 17:14:42 -0500
Subject: added some flair to freeform views

---
 .../views/collections/CollectionSchemaView.scss    | 357 ++++++++++-----------
 1 file changed, 178 insertions(+), 179 deletions(-)

(limited to 'src/client/views/collections/CollectionSchemaView.scss')

diff --git a/src/client/views/collections/CollectionSchemaView.scss b/src/client/views/collections/CollectionSchemaView.scss
index d40e6d314..2fd4a2df0 100644
--- a/src/client/views/collections/CollectionSchemaView.scss
+++ b/src/client/views/collections/CollectionSchemaView.scss
@@ -1,185 +1,140 @@
-
-
 .collectionSchemaView-container {
-    border-style: solid;
-    box-sizing: border-box;
+  border-style: solid;
+  box-sizing: border-box;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  .collectionSchemaView-previewRegion {
+    position: relative;
+    background: black;
+    float: left;
+    height: 100%;
+  }
+  .collectionSchemaView-previewHandle {
     position: absolute;
+    height: 37px;
+    width: 20px;
+    z-index: 20;
+    right: 0;
+    top: 0;
+    background: Black;
+  }
+  .collectionSchemaView-dividerDragger {
+    position: relative;
+    background: black;
+    float: left;
+    height: 100%;
+  }
+  .collectionSchemaView-tableContainer {
+    position: relative;
+    float: left;
+    height: 100%;
+  }
+
+  .ReactTable {
+    position: absolute;
+    // display: inline-block;
+    // overflow: auto;
     width: 100%;
     height: 100%;
-    .collectionSchemaView-previewRegion {
-        position: relative; 
-        background: black; 
-        float: left; 
-        height: 100%;
-    }
-    .collectionSchemaView-previewHandle {
-        position: absolute;
-        height: 37px;
-        width: 20px; 
-        z-index: 20; 
-        right: 0; 
-        top: 0; 
-        background: Black ;
-    }
-    .collectionSchemaView-dividerDragger{
-        position: relative; 
-        background: black; 
-        float: left; 
-        height: 100%;
-    }
-    .collectionSchemaView-tableContainer {
-        position: relative;
-        float: left;
-        height: 100%; 
-    }
+    background: white;
+    box-sizing: border-box;
+    .rt-table {
+      overflow-y: auto;
+      overflow-x: auto;
+      height: 100%;
 
-    .ReactTable {
-        position: absolute;
-       // display: inline-block;
-       // overflow: auto;
-        width: 100%;
+      display: -webkit-inline-box;
+      direction: ltr;
+      // direction:rtl;
+      // display:block;
+    }
+    .rt-tbody {
+      //direction: ltr;
+      direction: rtl;
+    }
+    .rt-tr-group {
+      direction: ltr;
+      max-height: 44px;
+    }
+    .rt-td {
+      border-width: 1;
+      border-right-color: #aaa;
+      .imageBox-cont {
+        position: relative;
+        max-height: 100%;
+      }
+      .imageBox-cont img {
+        object-fit: contain;
+        max-width: 100%;
         height: 100%;
-        background: white;
-        box-sizing: border-box;
-        .rt-table {
-            overflow-y: auto;
-            overflow-x: auto;
-            height: 100%;
-
-            display: -webkit-inline-box;
-            direction: ltr;
-            // direction:rtl;
-            // display:block;
-        }
-        .rt-tbody {
-            //direction: ltr;
-            direction: rtl;
-        }
-        .rt-tr-group {
-            direction: ltr;
-            max-height: 44px;
-        }
-        .rt-td {
-            border-width: 1;
-            border-right-color: #aaa;
-            .imageBox-cont {
-                position:relative;
-                max-height:100%;
-            }
-            .imageBox-cont img {
-                object-fit: contain;
-                max-width: 100%;
-                height: 100%
-            }
-        }
-        .rt-tr-group {
-            border-width: 1;
-            border-bottom-color: #aaa
-        }
-    }
-    .ReactTable .rt-thead.-header {
-            background:grey;
-        }
-    .ReactTable .rt-th, .ReactTable .rt-td {
-        max-height: 44;
-        padding: 3px 7px;
-    }
-    .ReactTable .rt-tbody .rt-tr-group:last-child {
-        border-bottom: grey;
-        border-bottom-style: solid;
-        border-bottom-width: 1;
-    }
-    .documentView-node:first-child {
-        background: grey;
-        .imageBox-cont img {
-            object-fit: contain;
-        }
-    }
+      }
+    }
+    .rt-tr-group {
+      border-width: 1;
+      border-bottom-color: #aaa;
+    }
+  }
+  .ReactTable .rt-thead.-header {
+    background: grey;
+  }
+  .ReactTable .rt-th,
+  .ReactTable .rt-td {
+    max-height: 44;
+    padding: 3px 7px;
+  }
+  .ReactTable .rt-tbody .rt-tr-group:last-child {
+    border-bottom: grey;
+    border-bottom-style: solid;
+    border-bottom-width: 1;
+  }
+  .documentView-node:first-child {
+    background: grey;
+    .imageBox-cont img {
+      object-fit: contain;
+    }
+  }
 }
 
 .Resizer {
-    box-sizing: border-box;
-    background: #000;
-    opacity: 0.5;
-    z-index: 1;
-    background-clip: padding-box;
-    &.horizontal {
-        height: 11px;
-        margin: -5px 0;
-        border-top: 5px solid rgba(255, 255, 255, 0);
-        border-bottom: 5px solid rgba(255, 255, 255, 0);
-        cursor: row-resize;
-        width: 100%;
-        &:hover {
-            border-top: 5px solid rgba(0, 0, 0, 0.5);
-            border-bottom: 5px solid rgba(0, 0, 0, 0.5);
-        }
-    }
-    &.vertical {
-        width: 11px;
-        margin: 0 -5px;
-        border-left: 5px solid rgba(255, 255, 255, 0);
-        border-right: 5px solid rgba(255, 255, 255, 0);
-        cursor: col-resize;
-        &:hover {
-            border-left: 5px solid rgba(0, 0, 0, 0.5);
-            border-right: 5px solid rgba(0, 0, 0, 0.5);
-        }
-    }
+  box-sizing: border-box;
+  background: #000;
+  opacity: 0.5;
+  z-index: 1;
+  background-clip: padding-box;
+  &.horizontal {
+    height: 11px;
+    margin: -5px 0;
+    border-top: 5px solid rgba(255, 255, 255, 0);
+    border-bottom: 5px solid rgba(255, 255, 255, 0);
+    cursor: row-resize;
+    width: 100%;
     &:hover {
-        -webkit-transition: all 2s ease;
-        transition: all 2s ease;
-    }
+      border-top: 5px solid rgba(0, 0, 0, 0.5);
+      border-bottom: 5px solid rgba(0, 0, 0, 0.5);
+    }
+  }
+  &.vertical {
+    width: 11px;
+    margin: 0 -5px;
+    border-left: 5px solid rgba(255, 255, 255, 0);
+    border-right: 5px solid rgba(255, 255, 255, 0);
+    cursor: col-resize;
+    &:hover {
+      border-left: 5px solid rgba(0, 0, 0, 0.5);
+      border-right: 5px solid rgba(0, 0, 0, 0.5);
+    }
+  }
+  &:hover {
+    -webkit-transition: all 2s ease;
+    transition: all 2s ease;
+  }
 }
 
 .vertical {
-    section {
-        width: 100vh;
-        height: 100vh;
-        display: -webkit-box;
-        display: -webkit-flex;
-        display: -ms-flexbox;
-        display: flex;
-        -webkit-box-orient: vertical;
-        -webkit-box-direction: normal;
-        -webkit-flex-direction: column;
-        -ms-flex-direction: column;
-        flex-direction: column;
-    }
-    header {
-        padding: 1rem;
-        background: #eee;
-    }
-    footer {
-        padding: 1rem;
-        background: #eee;
-    }
-}
-
-.horizontal {
-    section {
-        width: 100vh;
-        height: 100vh;
-        display: flex;
-        flex-direction: column;
-    }
-    header {
-        padding: 1rem;
-        background: #eee;
-    }
-    footer {
-        padding: 1rem;
-        background: #eee;
-    }
-}
-
-.parent {
-    width: 100%;
-    height: 100%;
-    -webkit-box-flex: 1;
-    -webkit-flex: 1;
-    -ms-flex: 1;
-    flex: 1;
+  section {
+    width: 100vh;
+    height: 100vh;
     display: -webkit-box;
     display: -webkit-flex;
     display: -ms-flexbox;
@@ -189,19 +144,63 @@
     -webkit-flex-direction: column;
     -ms-flex-direction: column;
     flex-direction: column;
+  }
+  header {
+    padding: 1rem;
+    background: #eee;
+  }
+  footer {
+    padding: 1rem;
+    background: #eee;
+  }
+}
+
+.horizontal {
+  section {
+    width: 100vh;
+    height: 100vh;
+    display: flex;
+    flex-direction: column;
+  }
+  header {
+    padding: 1rem;
+    background: #eee;
+  }
+  footer {
+    padding: 1rem;
+    background: #eee;
+  }
+}
+
+.parent {
+  width: 100%;
+  height: 100%;
+  -webkit-box-flex: 1;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
 }
 
 .header {
-    background: #aaa;
-    height: 3rem;
-    line-height: 3rem;
+  background: #aaa;
+  height: 3rem;
+  line-height: 3rem;
 }
 
 .wrapper {
-    background: #ffa;
-    margin: 5rem;
-    -webkit-box-flex: 1;
-    -webkit-flex: 1;
-    -ms-flex: 1;
-    flex: 1;
-}
\ No newline at end of file
+  background: #ffa;
+  margin: 5rem;
+  -webkit-box-flex: 1;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+}
-- 
cgit v1.2.3-70-g09d2