Merge branch 'master' of https://github.com/browngraphicslab/Dash-Web into interaction_stanley

1 files changed, 77 insertions, 0 deletions

diff --git a/src/client/views/CollectionLinearView.scss b/src/client/views/CollectionLinearView.scss
new file mode 100644
index 000000000..46a226eef
--- /dev/null
+++ b/src/client/views/CollectionLinearView.scss
@@ -0,0 +1,77 @@
+@import "globalCssVariables";
+@import "nodeModuleOverrides";
+
+.collectionLinearView-outer{
+    overflow: hidden;
+    height:100%;
+    padding:5px;
+}
+.collectionLinearView {
+    display:flex;
+    >label {
+        background: $dark-color;
+        color: $light-color;
+        display: inline-block;
+        border-radius: 18px;
+        font-size: 25px;
+        width: 36px;
+        height: 36px;
+        margin-right: 10px;
+        cursor: pointer;
+        transition: transform 0.2s;
+    }
+
+    label p {
+        padding-left: 10.5px;
+        width: 500px;
+        height: 500px;
+    }
+
+    label:hover {
+        background: $main-accent;
+        transform: scale(1.15);
+    }
+
+    >input {
+        display: none;
+    }
+    >input:not(:checked)~.collectionLinearView-content {
+        display: none;
+    }
+
+    >input:checked~label {
+        transform: rotate(45deg);
+        transition: transform 0.5s;
+        cursor: pointer;
+    }
+
+    .collectionLinearView-content {
+        display: flex;
+        opacity: 1;
+        padding: 0;
+        position: relative;
+        .collectionFreeFormDocumentView-container {
+            position: relative;
+        } 
+        .collectionLinearView-docBtn {
+            position:relative;
+            margin-right: 10px;
+        }
+        .collectionLinearView-round-button {
+            width: 36px;
+            height: 36px;
+            border-radius: 18px;
+            font-size: 15px;
+        }
+        
+        .collectionLinearView-round-button:hover {
+            transform: scale(1.15);
+        }
+        
+    }
+    
+    .collectionLinearView-add-button {
+        position: relative;
+        margin-right: 10px;
+    }
+}