moving things around. changed multiColumnView to not use intermediate config docs.

1 files changed, 75 insertions, 0 deletions

diff --git a/src/client/views/collections/CollectionLinearView.scss b/src/client/views/collections/CollectionLinearView.scss
new file mode 100644
index 000000000..eae9e0220
--- /dev/null
+++ b/src/client/views/collections/CollectionLinearView.scss
@@ -0,0 +1,75 @@
+@import "../globalCssVariables";
+@import "../_nodeModuleOverrides";
+
+.collectionLinearView-outer{
+    overflow: hidden;
+    height:100%;
+    .collectionLinearView {
+        display:flex;
+        height: 100%;
+        >label {
+            background: $dark-color;
+            color: $light-color;
+            display: inline-block;
+            border-radius: 18px;
+            font-size: 12.5px;
+            width: 18px;
+            height: 18px;
+            margin-top:auto;
+            margin-bottom:auto;
+            margin-right: 3px;
+            cursor: pointer;
+            transition: transform 0.2s;
+        }
+
+        label p {
+            padding-left:5px;
+        }
+
+        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;
+            position: relative;
+            margin-top: auto;
+
+            .collectionLinearView-docBtn, .collectionLinearView-docBtn-scalable {
+                position:relative;
+                margin:auto;
+                margin-left: 3px;
+                transform-origin: center 80%;
+            }
+            .collectionLinearView-docBtn-scalable:hover {
+                transform: scale(1.15);
+            }
+
+            .collectionLinearView-round-button {
+                width: 18px;
+                height: 18px;
+                border-radius: 18px;
+                font-size: 15px;
+            }
+            
+            .collectionLinearView-round-button:hover {
+                transform: scale(1.15);
+            }
+        }
+    }
+}